这篇文章主要介绍了vue 过滤器filters的实例代码以及vue过滤器的基本用法,需要的朋友可以参考下
1、示例代码
采用vue单文件组件,使用moment插件格式化日期
<template> <p> <h1>{{date | dateformat}}</h1> </p></template><script> import moment from 'moment'; import 'moment/locale/zh-cn'; moment.locale('zh-cn'); export default { data() { return { date: new date() } }, filters: { dateformat(val) { return moment(val).calendar(); } } }</script>
2、效果
3、说明
过滤器内是没有this引用的,过滤器内的this是undefined,所以不要在过滤器内尝试使用this引用组件实例的变量或者方法。
ps:下面看下vue 过滤器的基本用法
// 注册vue.filter('my-filter', function (value) { // 返回处理后的值})// getter,返回已注册的过滤器var myfilter = vue.filter('my-filter')//在mustache中使用{{ msg | uppercase }}
或
//在标签中使用<input type="password" v-model="psw | validate">
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
使用jquery+css如何实现table表格
如何使用vue实现评论框架
有关v4 history不能访问的原因
为何response.body().string()不能实现多次调用?
使用vue组件如何实现日历(详细教程)
利用webpack搭建vue脚手架
以上就是在vue中关于过滤器filters的用法的详细内容。