一、绑定HTML Class
①对象语法(对象中的属性值为true时才能添加class)
渲染结果为:
实现同样的效果,也可以直接绑定数据里的一个对象,这种写法更加清爽!
也可以计算属性,即在computed中定义函数
②数组语法(不止可以传对象,还可以传数组)
渲染结果为:
此例始终添加errorClass,但是只有在isActive是 true 时添加activeClass。
③With Components
这个部分竟然没有中文文档,不过还好咱能看懂。
当为组件添加class时,这些classes会被重新添加到根元素上,例如:
重复添加了class:
但是有一个比较有趣的地方是,可以在自定义的组件标签上添加active class,为真时添加到根元素active,为假时删除active。
二、绑定内联样式
①对象语法
②数组语法
将多个样式对象应用到一个元素上:
③自动添加前缀
当v-bind:style使用需要特定前缀的 CSS 属性时,如transform,Vue.js 会自动侦测并添加相应的前缀。
学好Vue!
成为优秀的前端工程师!