博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vue2.0中Filter
阅读量:5960 次
发布时间:2019-06-19

本文共 778 字,大约阅读时间需要 2 分钟。

实例

  1. vue2.0里,不再有自带的过滤器,需要自己定义过滤器
Vue.filter('reverseStr', function(value) {    return value.split('').reverse().join('')});
//render result
dcba
复制代码
  1. Vue 的过滤器操作符 | 和 Shell 命令一样,能将上一个过滤器输出内容作为下一个过滤器的输入内容,也就是说 Vue 允许你这样使用过滤器:
Vue.filter('removeNum', function (value) {  return value.replace(/[^0-9]/g, '');})//*.vue
//render result
dcba
复制代码

v-html

是不是很好很强大?!但在 Vue2.0 中使用过滤器我遇到一个这样的场景,我需要在 v-html 指令中使用过滤器,如下:

复制代码

3.这种写法在 Vue1.0 中并没有问题,但是在 Vue2.0 中抛出错误: 过滤器现在只能用在两个地方:mustache 插值和 v-bind 表达式。在 v-model 、v-on 、v-for 等指令时 Vue 还是推荐我们将该逻辑通过 computed 来计算属性。所以我们需要进行改写:

复制代码

转载地址:http://qwfax.baihongyu.com/

你可能感兴趣的文章
Java内存区域和内存模型
查看>>
写python 报错 IndentationError:unindent does not match any outer indentation level
查看>>
iOS 黑魔法 runtime 消息转发 ---附Demo
查看>>
在MySQL中,不要使用“utf8”。使用“utf8mb4”
查看>>
了解 IT 认证价值
查看>>
关于安卓的ViewStub,我有几句话想说。。。
查看>>
Android AOSP基础(一)趁周末用VirtualBox 安装 Ubuntu吧
查看>>
python学习笔记-5.13
查看>>
vuecli3创建项目
查看>>
版本控制工具——Git常用操作(上)
查看>>
5分钟构建无服务图片鉴黄web应用(基于FunctionGraph)
查看>>
神经科学研究所开发AI动作捕捉工具 以高精准度追踪动物动作
查看>>
vue组件之Tabs标签页
查看>>
ES6之变量的解构赋值
查看>>
用localStorage存储购物车数据实战
查看>>
“一带一路”为会展业带来新机遇
查看>>
Spring详解
查看>>
Go defer 知识点
查看>>
【本人秃顶程序员】如何在代码中应用设计模式
查看>>
当你凝视黑洞的时候,它已经被玩坏了
查看>>