过滤器的使用
msgFormt是你自己定义的过滤器方法,
Vue.filter是你自己定义的全局过滤器。没有s
过滤器要有返回值哈 用retuen
    Vue.filter("msgFormt",function (msg,th) {
       //第一参数 msgFormt 是方法
       //第二个参数msg,是数据源,
       //第三个参数,是自己在  <p>{{ msg | msgFormt("飞宇") }}</p>  中传递的参数 ‘飞宇’
       return msg.replace(/单纯/g,th)
    });
 
<div id="app">
<p>{{ msg | msgFormt }}</p>
<!-- msgFormt是一个过滤器 -->
</div> <script>
Vue.filter("msgFormt",function(msg){
return msg.replace(/单纯/g,"邪恶")
}) var vm=new Vue({
el:"#app",
data:{
msg:"我是一个单纯的少年,单纯的我,傻傻的问,谁是单纯的人"
}
})
</script>

最后在页面输出  它会将原来的类容替换了

我是一个邪恶的少年,邪恶的我,傻傻的问,谁是邪恶的人

<div id="app">
<!--通过传递参数---可以随意的替换值-->
<p>{{ msg | msgFormt("飞宇") }}</p> <!-- msgFormt是一个过滤器 -->
</div> <script>
//定义一个全局过滤器---
Vue.filter("msgFormt",function (msg,th) {
return msg.replace(/单纯/g,th)
}); vm=new Vue({
el:"#app",
data:{
msg:"单纯的我,单纯的问,谁是单纯的人"
}
});

最后输出   飞宇的我,飞宇的问,谁是飞宇的人

Vue全局过滤器的使用 运用在时间过滤 内容添加crud的更多相关文章

  1. vue 全局过滤器(单个和多个过滤器)

    参考: https://www.cnblogs.com/liujn0829/p/8622960.htmlhttps://blog.csdn.net/z8735058/article/details/7 ...

  2. Asp.Net MVC4中的全局过滤器,

    可以对整个项目进行全局监控. 新建一个MVC4项目,可以在global.asax文件中看到如下代码:  FilterConfig.RegisterGlobalFilters(GlobalFilters ...

  3. C#面试题(转载) SQL Server 数据库基础笔记分享(下) SQL Server 数据库基础笔记分享(上) Asp.Net MVC4中的全局过滤器 C#语法——泛型的多种应用

    C#面试题(转载) 原文地址:100道C#面试题(.net开发人员必备)  https://blog.csdn.net/u013519551/article/details/51220841 1. . ...

  4. Asp.Net MVC4中的全局过滤器

    可以对整个项目进行全局监控. 新建一个MVC4项目,可以在global.asax文件中看到如下代码:  FilterConfig.RegisterGlobalFilters(GlobalFilters ...

  5. vue自定义过滤器的创建和使用

    1.简单介绍   过滤器的作用:实现数据的筛选.过滤.格式化.   过滤器的本质是一个有参数,有返回值的方法.   过滤器可以用在两个地方:双花括号插值和v-bind表达式(后者从2.1.0+开始支持 ...

  6. MVC全局过滤器

    Asp.NET MVC4中的全局过滤器,可以对整个项目进行全局监控. 新建一个MVC4项目,可以在global.asax文件中看到如下代码:  FilterConfig.RegisterGlobalF ...

  7. 第二章 Vue快速入门-- 25 过滤器-定义格式化时间的全局过滤器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  8. Vue中全局过滤器期与局部过滤器期的使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. Vue 项目中添加全局过滤器以及全局混合mixin

    可以在.vue文件中定义局部使用的过滤器 export default{ data(){ return [] }, filters:{ toUpperCase:function(value){ ret ...

随机推荐

  1. C# FlagAttriute 的 小妙招

    FlagAttriute ,指示可将枚举视为位域(即一组标志). 官网中文解说:https://docs.microsoft.com/zh-cn/dotnet/api/system.flagsattr ...

  2. Docker系列03-容器Docker镜像的使用

    Docker镜像的使用前两个章节,介绍了容器的相关基础知识,这章我们介绍镜像的简单使用,镜像hub里面有来自于全世界贡献的各种镜像,包括一些入门和学习练手的镜像,今天我们使用的正式其中一个用于学习练习 ...

  3. LNMP(5)

    目录 一.实战 1.安装 安装nginx 数据库 php wordpress 2.三者建立联系 nginx和php建立联系 php与mariadb建立关系 二.数据分离 三.理论 静态和动态 web应 ...

  4. Java之Iterator接口(遍历单列集合的迭代器)

    Iterator接口概述 在程序开发中,经常需要遍历集合中的所有元素.针对这种需求,JDK专门提供了一个接口java.util.Iterator . Iterator 接口也是Java集合中的一员,但 ...

  5. IntelliJ IDEA安装与使用

    官网:https://www.jetbrains.com/ 点击 点击下载 点击

  6. bzoj5093图的价值:多项式,斯特林数(二项式反演)

    Description “简单无向图”是指无重边.无自环的无向图(不一定连通). 一个带标号的图的价值定义为每个点度数的k次方的和. 给定n和k,请计算所有n个点的带标号的简单无向图的价值之和. 因为 ...

  7. 高阶函数&&高阶组件(二)

    高阶组件总共分为两大类 代理方式 操纵prop 访问ref(不推荐) 抽取状态 包装组件 继承方式 操纵生命周期 操纵prop 代理方式之 操纵prop 删除prop import React fro ...

  8. SpringData JPA实现增删改

    一.创建实体类并自动生成数据库表 二.dao层继承JpaRepository 三.controller中增加操作 四.controller中删除操作 五.controller中修改操作

  9. 阿里面试实战题2----ReentrantLock里面lock和tryLock的区别

    ReentrantLock ReentrantLock(轻量级锁)也可以叫对象锁,可重入锁,互斥锁.synchronized重量级锁,JDK前期的版本lock比synchronized更快,在JDK1 ...

  10. Ruby中星号打包解包操作

    Ruby中可以使用一个星号*和两个星号**完成一些打包.解包操作,它们称为splat操作符: 一个星号:以数组为依据进行打包解包(参考文章) 两个星号:以hash为依据进行打包解包(参考文章) 两个星 ...