vue 弹出框自适应宽度
<template><el-dialog :close-on-click-modal="false" :visible.sync="visible" :width="dialogWidth" ></el-dialog></template><script>export default {data() {return {visible: f
·
<template>
<el-dialog :close-on-click-modal="false" :visible.sync="visible" :width="dialogWidth" >
</el-dialog>
</template>
<script>
export default {
data() {
return {
visible: false,
dialogWidth: "1080px",
}
},
created() {
this.setDialogWidth()
},
mounted() {
window.onresize = () => {
return (() => {
this.setDialogWidth()
})()
}
},
methods: {
setDialogWidth() {
var val = document.body.clientWidth
const def = 1080 // 默认宽度
if (val < def) {
this.dialogWidth = '100%'
} else {
this.dialogWidth = def + 'px'
}
},
}
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)