vue动态改变当前样式(css)
文章目录前言一、要怎么做?二、使用步骤1.首先,在data中要有样式数据2.在computed中添加这段代码3.在需要改变样式的地方添加总结前言例如:项目中我们需要动态改变当前页面的样式一、要怎么做?示例:1.首先我们要拿到数据中背景图数据2.然后在你需要的添加背景图div出添加定义的style二、使用步骤1.首先,在data中要有样式数据代码如下(示例):data: {//动态背景图片leftS
·
前言
例如:项目中我们需要动态改变当前页面的样式
一、要怎么做?
示例:1.首先我们要拿到数据中背景图数据
2.然后在你需要的添加背景图div出添加定义的style
二、使用步骤
1.首先,在data中要有样式数据
代码如下(示例):
data: {
//动态背景图片
leftStyle: { background: "#AF7F3F" }
}
2.在computed中添加这段代码
代码如下(示例):
computed: {
myStyle() {
return { "--myStyle": this.leftStyle.background };
}
}
3.在需要改变样式的地方添加
<div class="choose_classify" >
<p v-cloak :style="myStyle" >{{v.text}}</p>
</div>
总结
例如:以上就是今天要讲的内容,本文仅仅简单介绍了动态改变css样式的使用,经供参考
更多推荐
已为社区贡献7条内容
所有评论(0)