🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
1. 直接在元素上通过`:style`的形式,书写样式对象 ``` <div id="app"> <h1 :style="styleObj">Vue教程</h1> </div> ``` 2. 将样式对象定义到`data`中,并直接引用到`:style`中 ``` <div id="app"> <h1 :style="styleObj">Vue教程</h1> </div> <script> var vm = new Vue({ el: '#app', data: { styleObj: {color:'red', 'text-decoration': 'underline'} } }) </script> ``` 3. 在`:style`中通过数组,引用多个`data`上的样式对象 ``` <div id="app"> <h1 :style="[styleObj, styleObj2]">Vue教程</h1> </div> ``` 4. 三元表达式 ``` :style="{width:isCollpase?'58px':'300px'}" ```