Vue自定义过滤器

 2023-09-19 阅读 20 评论 0

摘要:Vue自定义过滤器 flask自定义过滤器?定义语法 Vue.filter('过滤器名字',function (data) { //处理数据的操作})-------------------------------------案列一 将以后替换成将来------------------------------------------------------- <!DOCTYPE htm

                    Vue自定义过滤器

flask自定义过滤器?定义语法

 

Vue.filter('过滤器名字',function (data) {
//处理数据的操作
})
-------------------------------------案列一 将以后替换成将来-------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../vue.js"></script>
</head>
<body>
<div id="app">
{{mes | glq}}
</div>
</body>
<script>
/*过滤器的定义语法 第一个参数规定死了 肯定是管道符传过来的数据*/
Vue.filter('glq',function (data) {
/*replace 可写一个字符串 还可以写正则表达式*/
//return data.replace('以后','将来');
return data.replace(/以后/g,'将来');
})

new Vue({
el: "#app",
data:{
mes:"以后的以后你是谁的某某某"
}
});
</script>
</html>
-------------------------------------案列一  传参数动态更改修改的文字可以传递多个参数  -------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../vue.js"></script>
</head>
<body>
<div id="app">
{{mes | glq('现在')}}
//多个参数在后面加即可glq('现在','十年后','百年后')

</div>
</body>
<script>
/*过滤器的定义语法 第一个参数规定死了 肯定是管道符传过来的数据*/
Vue.filter('glq',function (data,arg) {//多个参数在后面加即可(data,arg,arg1,.....)

/*replace 可写一个字符串 还可以写正则表达式*/
//return data.replace('以后','将来');
return data.replace(/以后/g,arg);
})

new Vue({
el: "#app",
data:{
mes:"以后的以后你是谁的某某某"
}
});
</script>
</html>

-------------------------------------过滤器可以同时调用多个  定义完成在{{}}添加即可  -------------------------------------------------------
-------------------------------------案列二 -------------------------------------------------------

过滤器的定义,item.ctime为new date();

pattern 为格式

-------------------------------------私有过滤器-------------------------------------------------------

java自定义过滤器? 定义在组件内部filters

参数可以给默认值 pattern = ' '

如何定义过滤器, 

 

 
 

 

 

自定义权限过滤器, 

转载于:https://www.cnblogs.com/jiahaoJAVA/p/9471257.html

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://hbdhgg.com/3/78646.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 匯編語言學習筆記 Inc. 保留所有权利。

底部版权信息