本文摘自PHP中文网,作者coldplay.xixi,侵删。
vue.js改变样式的方法:首先给元素定义ref属性;然后通过js方法修改元素的样式,代码为【'background-color:#1F2429;width:66px'】;最后修改单一样式时可直接使用样式名称。
本教程操作环境:windows7系统、vue2.9.6版,该方法适用于所有品牌电脑。
【相关文章推荐:vue.js】
vue.js改变样式的方法:
1、给元素定义ref属性
1 | <el-button ref= "btnClick" class = "list_button" " @click=" openClose"></el-button>
|
2、通过js 方法修改元素的样式 修改较多样式时可使用cssText
1 2 3 4 5 6 7 8 9 10 11 12 | function openClose() {
this.isCollapse = !this.isCollapse
if (this.isCollapse) {
this. $refs .btnClick. $el .style.cssText =
'background-color:#1F2429;width:66px' ;
} else {
this. $refs .btnClick. $el .style.cssText =
'background-color:#1F2429;width:140px' ;
}
}
|
阅读剩余部分
相关阅读 >>
vue.js一般用在什么地方
vue.js和bootstrap之间有什么区别?
配置h5的滚动条样式
vue.js特性是什么?
vue.js有哪些ui框架?
vue.js就是node吗
分析一下vue.use的源码
vue.js图片怎么渲染
怎样运行别人的vue.js
vue.js主要应用哪方面
更多相关阅读请进入《vue.js》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » vue.js怎么改变样式