Vue2.x基础总结(02)

1. vue中使用css样式

  【注意】上面的4个案例,除了最后一个其余三个的数组中的单引号圈起来的都是在<style>标签中自定义的样式类型!不带有单引号的都是Vue对象的data对应的内容!而最后一个案例直接写对象,而非数组,对象中的red、italic、active、thin都是在<style>标签中自定义的样式。自定义的样式建议全部使用单引号圈起来,方便!

【注意】

           1.上面的4个案例,除了最后一个其余三个的数组中的单引号圈起来的都是在<style>标签中自定义的样式类型!不带有单引号的都是Vue对象的data对应的内容!而最后一个案例直接写对象,而非数组,对象中的red、italic、active、thin都是在<style>标签中自定义的样式。自定义的样式建议全部使用单引号圈起来,方便! 

           2. 上面的案例4比较常用,一般都是用来实现选中的内容高亮显示!也就是给选中的内容添加某一个属性。

【注意】

           1.内联样式一般都是CSS样式属性!注意CSS属性里面若是有“-”符号,必须用单引号圈起来或是写成驼峰的形式。

                例如:'background-image' 或是 backgroundImage

          

2. 全局过滤器、私有过滤器

 【注意】

         1.过滤器在使用时,默认函数第一参数是管道符号前面的内容,函数后面的参数是函数调用时传递过来的。若是没有多余的参数传递,函数调用时小括号可以省略

         2. 日期过滤器一般都会用插件date-fns

【注意】若是在Vue对象的控制区域内,在过滤器调用的过程中若是全局过滤器与私有过滤器重名了,优先考虑私有过滤器! 

3. 自定义全局指令、私有指令

 

全局指令定义: 

私有指令定义:

指令调用的方式一致:

【注意】自定义指令就是可以把Dom元素按照我们自定义的方式、样式展现!(个人感觉不是很常用)

4.  自定义键盘修饰符

【注意】一般情况下,我们在不做自定义键盘修饰符时,调用的方式是@keyup.113="add",这样程序员也不知道按那个按键会触发add方法,我们做了自定义键盘修饰符之后,提高程序员体验! 

 

 @keyup.别名="func" ,上面的别名其实就是按键名!

猜你喜欢

转载自blog.csdn.net/FullStackDeveloper0/article/details/85002001