没有合适的资源?快使用搜索试试~ 我知道了~
Vuejs实战训练第一篇.docx
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 142 浏览量
2023-09-15
10:47:37
上传
评论
收藏 20KB DOCX 举报
温馨提示
试读
11页
Vuejs实战训练第一篇.docx
资源推荐
资源详情
资源评论
Vuejs 实战(一)
第一章 过滤器
过滤器是一个通过输入数据,能够及时对数据进行处理并返回一个数
据结果的简单的函数。
在实际项目开发中根据实际的需求,可以自己编写所需要的过滤器。
过滤器经常用在数据所需的格式化时使用:
例如
字符串的格式化
以及日期时间的格式化等等
过滤器最大的作用就是体现其复用性,如果我们在前端处理的某些文
本信息每一次都需要经过重复的特殊处理,那么我们一定是要编写一
个过滤器来使用。
1-1 全局过滤器的使用
全局过滤器指的是所有 vm 对象都能共享使用的过滤器。
过滤器能够使用在两个地方:
(mustache)插值表达式/指令(bind 属性)
过滤器的语法:使用管道符 "|"
过滤器在插值表达式中的使用
案例:将所有的字母变成大写
案例:定义格式化时间的全局过滤器
过滤器在 v-for 中的使用
案例:将所有的商品进行打折(打 8 折,5 折...)
以上的案例,我们都是使用在了插值表达式当中,除了使用在插值表
达式中之外,我们的过滤器还可以说使用在 bind 属性指令当中,该
形式没有插值表达式使用的广泛。
可以连续使用多个过滤器
1-2 私有过滤器的使用
私有过滤器指的是在指定的 vm 对象中来定义过滤器,该过滤器只
在
当前的 vm 对象中会发挥作用,其他的 vm 对象不能使用的。
语法:在 vm 对象中指定过滤器相关的属性和属性值
vm
filters:{
filter1
filter2
...
}
如果全局过滤器和私有过滤器的命名是一样的,那么默认使用的是私
有过滤器。
系统在使用过滤器的时候,根据名称去找相应的过滤器,先找私有过
滤器,如果没有私有的,则继续通过该名称寻找全局过滤器。
这种方式也被称之为就近原则(优先使用的是范围窄的)。
全局过滤器和私有过滤器能够搭配起来一起使用的
如果是按钮 123 的顺序
执行结果为
如果是按照 321 的顺序
执行结果为
通过以上测试结果,观察得到以下结论
过滤器的使用:
可以同时使用多个过滤器,这多个过滤器在一起使用的时候,是
具有信息传递性的。先处理排在前面的过滤器,得到结果传递到下一
个过滤器中继续进行后续处理。
第二章 指令
1-1 自定义全局指令
指令与属性相似,是对指定元素样式或行为的赋予。
我们可以在实际项目开发中自定义一些我们所需的指令来有效的管
理元素。
在页面中自定义的全局指令,可以为每一个 vm 对象中的元素提供
服
务,只要 vm 中的标签引用了全局指令那么一定会即时生效,一般
情
况下我们普遍做的都是自定义全局指令来管理元素。
值得一提的是自定义指令需要经常搭配 vuejs 中的钩子函数来进行
操
作。在我们学习完指令之后,将在下一个章节(对象的生命周期)对
剩余10页未读,继续阅读
资源评论
Java毕设王
- 粉丝: 7289
- 资源: 1083
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功