我的Vue之旅(4)

2020-10-26

使用v-bind来绑定class属性主要是分成了两类,即对象语法数组语法,其实在数组中也是可以混用对象语法的,但在Demo3中我没有
写出来,有兴趣的话可以自己试试。在HTML中通过对象语法绑定类,对象的key值就是需要绑定的class, value是一个布尔值,为true时就绑定,
否则就不绑定。使用对象数组绑定相对就更简单了,直接把相应的类写入数组就可以了。使用数组绑定时,一般一个类会用一个property来做为别名。
而在组件上绑定上class, 坑爹的,现在还没成功,等后面对组件了更解一些之后再回头来试试。

绑定sytle的方法其实和绑定class差不多,不多说,直接看Demo4。不过有一个点要注意的就是,在Data中写一个css 对象的时候,与平时的css
的proptery是不太一样的。例如 background-color: 'green', 直接这样写是不行的,要么给background-color加上引号,要么就写成驼峰式backgroundColor,
这样就可以不加引号。否则,就会报错,至于为啥,人家就是这么定的,问就是不知道。当然,像color这种只有一个词的property怎么搞都问题不大。

Examples: Demo3.html, Demo4.html
Github:  https://github.com/jvxiao/vue-road

posted @ 2020-10-26 22:49  蓝柯柯  阅读(108)  评论(0编辑  收藏  举报