vue中style样式动态绑定
程序员文章站
2022-05-15 18:25:12
...
方法一:
(1) html中:
<div class="videoMa" id="videoMa" style="width:100%;height:100%;">
<div id="playWnd" class="playWnd" :style="{width:videoBox.width+ 'px',height:videoBox.height+ 'px'}"></div>
</div>
(2) data中:
videoBox:{
width:800,
height:500,
}
(3)mounted中:
mounted() {
let _that = this;
_that.videoBox.width=$("#videoMa").width();
_that.videoBox.height=$("#videoMa").height();
}
上一篇: 数据请求的四种方式
推荐阅读
-
快速解决vue动态绑定多个class的官方实例语法无效的问题
-
Vue模板语法中数据绑定的实例代码
-
vue2中使用sass并配置全局的sass样式变量的方法
-
vue的style绑定background-image的方式和其他变量数据的区别详解
-
vue组件中watch props根据v-if动态判断并挂载DOM的问题
-
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
-
解决vue 单文件组件中样式加载问题
-
vue通过style或者class改变样式的实例代码
-
vue组件中的样式属性scoped实例详解
-
vue中img src 动态加载本地json的图片路径写法