<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width,initial-scale=1.0">

    <title>Document</title>

    <!--1.导入Vue的包-->

    <script src=" https://cdn.jsdelivr.net/npm/vue"></script>

  </head>

  <body>

      <div id="app">

      <p>{{ msg|msgFormat('疯狂','233') | test }}</p>

      </div>

      <script>

      //定义一个Vue全局的过滤器，名字叫做 msgFormat

      Vue.filter('msgFormat',function(msg,arg,arg2){

        //字符串的 replace方法，第一个参数，除了可写一个字符串之外，还可以定义一个正则。正则表达式如果不加g修饰符，就替换第一个匹配成功的值，否则替换所有匹配成功的值。

       return msg.replace(/单纯/g,arg+arg2)

      })

      Vue.filter('test',function(msg){

        return msg+'========'

      })

          //创建 Vue 实例，得到 ViewModel

          var vm =  new Vue({

              el:'#app',

        data:{

          msg:'曾经，我是一个单纯的少年，单纯的我，傻傻的问，谁是世界上最单纯的男孩'

        },

        methods:{}

          });

      </script>

  </body>

</html>

第二章 Vue快速入门-- 24 过滤器-Vue中全局过滤器的基本使用的更多相关文章

  1. 第二章 Kubernetes快速入门

    一.四组基本概念 Pod/Pod控制器: Name/Namespace: Label/Label选择器: Service/Ingress. 二.Pod/Pod控制器 2.1 Pod Pod是K8S里能 ...

  2. vue 快速入门 系列 —— vue-cli 下

    其他章节请看: vue 快速入门 系列 Vue CLI 4.x 下 在 vue loader 一文中我们已经学会从零搭建一个简单的,用于单文件组件开发的脚手架:本篇,我们将全面学习 vue-cli 这 ...

  3. vue 快速入门 系列 —— 实例方法（或 property）和静态方法

    其他章节请看: vue 快速入门 系列 实例方法(或 property)和静态方法 在 Vue(自身) 项目结构 一文中,我们研究了 vue 项目自身构建过程,也知晓了 import Vue from ...

  4. vue 快速入门 系列 —— 虚拟 DOM

    其他章节请看: vue 快速入门 系列 虚拟 DOM 什么是虚拟 dom dom 是文档对象模型,以节点树的形式来表现文档. 虚拟 dom 不是真正意义上的 dom.而是一个 javascript 对 ...

  5. vue 快速入门 系列

    vue 快速入门(未完结,持续更新中...) 前言 为什么要学习 vue 现在主流的框架 vue.angular 和 react 都是声明式操作 DOM 的框架.所谓声明式,就是我们只需要描述状态与 ...

  6. vue 快速入门 系列 —— 初步认识 vue

    其他章节请看: vue 快速入门 系列 初步认识 vue vue 是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架. 所谓渐进式,就是你可以一步一步.有阶段 ...

  7. vue 快速入门 系列 —— vue 的基础应用（上）

    其他章节请看: vue 快速入门 系列 vue 的基础应用(上) Tip: vue 的基础应用分上下两篇,上篇是基础,下篇是应用. 在初步认识 vue一文中,我们已经写了一个 vue 的 hello- ...

  8. vue 快速入门 系列 —— vue loader 下

    其他章节请看: vue 快速入门 系列 vue loader 下 CSS Modules CSS Modules 是一个流行的,用于模块化和组合 CSS 的系统.vue-loader 提供了与 CSS ...

  9. vue 快速入门 系列 —— vue-cli 上

    其他章节请看: vue 快速入门 系列 Vue CLI 4.x 上 在 vue loader 一文中我们已经学会从零搭建一个简单的,用于单文件组件开发的脚手架:本篇,我们将全面学习 vue-cli 这 ...

随机推荐

  1. PTA --- 天梯赛 L1-064 估值一亿的AI核心代码

    L1-064 估值一亿的AI核心代码 (20 point(s)) 本题要求你实现一个稍微更值钱一点的 AI 英文问答程序,规则是: 无论用户说什么,首先把对方说的话在一行中原样打印出来: 消除原文中多 ...

  2. Python：Django 项目中可用的各种装备和辅助

    1 Redis 数据库 2 MySQL 数据库 3 前端服务器 live-server 4 定时任务 django-crontab扩展 5 Docker 容器 --用来运行 FastDFS 分布式文件 ...

  3. Python面试-websocket及web框架

    一.Websocket 1. websocket概念 在讲websocket之前,我们先来看看ajax轮询和long poll的实现机制. A.  ajax轮询 ajax轮询的原理非常简单,让浏览器隔 ...

  4. rpm操作

    --查找某个软件:abc rpm -qa |grep abc --删除某个软件:abc rpm -e --noscripts  abc

  5. 【linux开发】IO端口和IO内存的区别及分别使用的函数接口

    IO端口和IO内存的区别及分别使用的函数接口 每个外设都是通过读写其寄存器来控制的.外设寄存器也称为I/O端口,通常包括:控制寄存器.状态寄存器和数据寄存器三大类.根据访问外设寄存器的不同方式,可以把 ...

  6. 纯Js ——文字上下左右滚动

    ScrollBaseJs.js var $$ = function (id) { return typeof id == 'string' ? document.getElementById(id) ...

  7. Python globals()和locals()比较

    Python的两个内置函数,globals()和locals() ,它们提供了基于字典的访问局部和全局变量的方式. globals()是可写的,即,可修改该字典中的键值,可新增和删除键值对. 而loc ...

  8. 在 sys.servers 中找不到服务器 '10.0.2.13'。请验证指定的服务器名称是否正确。

    工作中,因为需要,搭建同事的程序模块,附加了从同事那里拷过来的该程序使用的库.(C#.C/S..Net Framework4.0 .WCF.Win10.SQL Server 2014.VS2015) ...

  9. codeforces 842C Ilya And The Tree （01背包+dfs）

    (点击此处查看原题) 题目分析 题意:在一个树中,有n个结点,记为 1~n ,其中根结点编号为1,每个结点都有一个值val[i],问从根结点到各个结点的路径中所有结点的值的gcd(最大公约数)最大是多 ...

  10. CSP 最大的矩形(201312-3)

    问题描述 在横轴上放了n个相邻的矩形,每个矩形的宽度是1,而第i(1 ≤ i ≤ n)个矩形的高度是hi.这n个矩形构成了一个直方图.例如,下图中六个矩形的高度就分别是3, 1, 6, 5, 2, 3 ...