可用过滤器实现某些文本的格式化 过滤器可以用在两个地方: 插值表达式和v-bind表达式
定义格式化时间
<td>{{item.ctime | dateFormat('yyyy-MM-DD')}}</td>
//全局的过滤器,进行时间的格式化
Vue.filter('dateFormat',function(dateStr,pattern){
//根据给定的时间字符串,得到特定的时间
var dt=new Date(dateStr);
var y=dt.getFullYear();
var m=dt.getMonth()+1;
var d=dt.getDate();
if(pattern.toLowerCase()==='yyyy-mm-dd'){
return '${y}-${m}-${d}'
}else{
var hh=dt.getHours();
var mm=dt.getMinutes();
var ss=dt.getSeconds();
return '${y}-${m}-${d} ${hh}:${mm}:${ss}'
}
})
所谓的全局过滤器,就是所有的VM实例都共享的
ES6的字符串新方法
padStart方法 用于项目中补零的情况 从开始位置填充
var m=(dt.getMonth()+1).toString().padStart(2,'0');
var d=dt.getDate().toString().padStart(2,'0'); 先转为字符串再填充
String.prototype.padStart(maxLength,''); maxLength代表填充后的长度,
后一个参数表示用什么来填充
自定义按键修饰符
系统提供的内置的按键修饰符
.enter .tab .delete .esc
.space .up .down .left .right
实例
<input type="text" v-mode="name" @keyup.enter="add">
表示按enter也同样触发add方法
<input type="text" v-mode="name" @keyup.f2="add">
这样不会触发add方法,因为不是内置的按键
这样修改才可以的
方法1:用码值来实现 f2对应的是113
<input type="text" v-mode="name" @keyup.113="add">
方法2:由于码值113不好记,就取个别名
自定义全局按键修饰符
Vue.config.keyCodes.f2=113;
<input type="text" v-mode="name" @keyup.f2="add">
总结:系统内置提供了几个,若不够用可以自定义的
Vue.js基础总结(二)
最新推荐文章于 2022-08-31 22:32:16 发布