VUE笔记 - 过滤器 Vue.filter 形参默认值 @keyup.f2 自定义按键修饰符
过滤器函数的传参:
第一个参数 A 是固定的,表示要过滤之前的内容。
第二个参数 B,表示要把原本的内容 A 过滤成 B。 写函数内容时, 这里第二处只写个参数。
实际的值要写到管道符调用函数的括号内。 如下:
{{ item.ctime | dateFormat('yyyy-mm-dd') }}
Vue.filter('过滤器的名称', function (A, B) {};
这里函数调用的时候没有传参, 但是在函数里写了一个默认值。
形参的默认值: 当不传入参数时,默认使用形参里的默认值 。
{{ item.ctime | dateFormat( ) }}
Vue.filter('dateFormat', function (dateStr, pattern = "") {}
<body>
<div id="app">
<p>{{msg | msgFormat('疯狂233') | test}}</p>
</div> <script>
Vue.filter('msgFormat', function(msg, arg){
// return msg.replace('单纯', '邪恶') // replace 要和正则搭配使用,否则无法匹配全局。
// return msg.replace(/单纯/g, '邪恶') // ! 注意这里正则的使用。
return msg.replace(/单纯/g, arg);
}); // 过滤器可以多次调用。
// {{msg | msgFormat('疯狂233') | test}}
// 初始信息被中间的过滤, 返回第二次的结果,第二次的结果又被第三次处理再返回。
Vue.filter('test', function(msg){
return msg + '======='
}); var vm = new Vue({
el:'#app',
data:{
msg:'曾经,我也是一个单纯的少年,单纯的我,傻傻地问,谁是世界上最单纯的男人。'
},
methods:{
}
});
</script>
</body>
自定义按键修饰符
Vue.config.keyCodes.f2 = 113;
事件调用
@keyup.f2
VUE笔记 - 过滤器 Vue.filter 形参默认值 @keyup.f2 自定义按键修饰符的更多相关文章
- 第二章 Vue快速入门-- 28 自定义按键修饰符
事件处理-按键修饰符 js 里面的键盘事件对应的键码 <!DOCTYPE html> <html lang="en"> <head> <m ...
- Vue 自定义按键修饰符
如点击F2 触发某个事件 <input type="button" name="" id="" value="添加" ...
- 「Vue」自定义按键修饰符
vue.config.keyCodes.f2 = 113 设置完成后就可以绑定f2的按键操作@keyup.f2="add" 自带的有enter esc delete 空格 上下左右 ...
- 从零开始学 Web 之 Vue.js(二)过滤器,按键修饰符,自定义指令
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- Vue学习笔记十一:按键修饰符和自定义指令(钩子函数)
目录 padStart:补位 按键修饰符 Vue提供的按键修饰符 自定义按键修饰符 自定义指令 自定义指令的使用 钩子函数 钩子函数参数 使用钩子函数的bingding参数 私有自定义指令 钩子函数的 ...
- Vue.js-06:第六章 - 按键修饰符的使用
一.前言 上周末的时候,准备试试将 ASP.NET Core 的项目部署到 CentOS 服务器上,结果在一个接一个坑里面跳,最后 Supervisor 守护程序还是有问题,于是,采用重装系统大招, ...
- vue.js(13)--按键修饰符
v-on监听事件时可添加按键修饰符 <!-- 只有在 `key` 是 `Enter` 时调用 `vm.submit()` --> <input v-on:keyup.enter=&q ...
- vue select下拉框绑定默认值
vue select下拉框绑定默认值: 首先option要加value值,以便v-model可以获取到对应选择的值 一.当没有绑定v-model,直接给对应的option加selected属性 二.当 ...
- 问题:C++形参默认值为什么一定要放在最后?
问题:C++形参默认值为什么一定要放在最后? 1.会出现歧义! 2.从汇编角度看是怎么回事? 待解答!!
随机推荐
- 实现人脸识别性别之路---网页上的video标签
<video> 元素支持三种视频格式: MP4, WebM, 和 Ogg.但是,不同的浏览器对视频格式的支持也不一致,因此为了让浏览器都适应,我们使用source属性来对视频文件格式定义 ...
- IntelliJ IDEA 详细图解最常用的配置 ,适合刚刚用的新人。(转)
IntelliJ IDEA使用教程 (总目录篇) 刚刚使用IntelliJ IDEA 编辑器的时候,会有很多设置,会方便以后的开发,磨刀不误砍柴工. 比如:设置文件字体大小,代码自动完成提示,版本管理 ...
- cogs 1446. [Commando War,Uva 11729]突击战
1446. [Commando War,Uva 11729]突击战 ★ 输入文件:commando.in 输出文件:commando.out 简单对比时间限制:1 s 内存限制:64 ...
- 无法在WEB服务器上启动调试
错误:站点使用 IP 地址 Visual Studio 2012 调试器尝试自动附加到正在使用 IP 地址的 Web 应用程序时,会发生该错误. 如果在 IIS 中将“网站标识”更改为“使用特定 IP ...
- ArcGIS Engine中添加点、线、面元素
转自原文 ArcGIS Engine中添加点.线.面元素 此种方式为IElement的方式在axMapControl的GraphicsContainer中好绘制图形. //画点 IPoint pt = ...
- PMP杂谈--制约因素与如果条件
制约因素和如果条件都是项目范围说明书的内容.它们是项目范围基准的一部分,是定义活动.估算活动持续时间.制定进度计划.估算成本.制定预算.识别风险和规划採购等多个过程的输入. 差别:制约因素是确定 ...
- opencms9.0安装
今天安装opencms 9.0遇到了一些问题,因为是初次安装和使用,导致耽误了非常多时间.所以在此记录一下以备以后借鉴. 首先附上安装步骤链接: http://www.51testing.com/ht ...
- RvmTranslator6.0 - AVEVA Marine Hull Model
eryar@163.com 1. Introduction RvmTranslator can translate the RVM file exported by AVEVA Plant(PDMS) ...
- 11.Axis客户端接收不同参数类型
转自:http://www.guance.com/708.html axis只支持简单类型的返回值.在这里逐一介绍axis的各种返回值接受. 1. axis接受基本类型,如int, string等 引 ...
- host---域名查询
host命令是常用的分析域名查询工具,可以用来测试域名系统工作是否正常. 选项 -a:显示详细的DNS信息: -c<类型>:指定查询类型,默认值为“IN“: -C:查询指定主机的完整的SO ...