vue过滤器filters使用方式之一(在双花括号中使用)

news/2024/7/9 23:59:41 标签: vue, filter

vuefilters_0">vue过滤器filters使用方式之一(在双花括号中使用)

过滤器的意思大概就是,经过过滤器过滤之后出来另一样你想要东西,过滤器就是一个过滤的工具。例如,从[‘abc’,‘abd’,‘ade’]数组中取得包含‘ab’的值,那么可通过过滤器筛选出来‘abc’和‘abd’;或者下面例子把时间戳改为自己设置的具体格式的时间。
过滤器可在new Vue实例前注册全局的,也可以在组件上写局部,以下例子用在局部。

下面展示一些 内联代码片

 <el-table-column label="Author" width="110" align="center">
    <template slot-scope="scope">
      {{ scope.row.regDatetime | formaTime }}
    </template>
  </el-table-column>

在一个组件的选项中定义本地的过滤器

filters:{
    formaTime(time){
    	let date = new Date(time)
        return formaTime (date,"YYYY-MM-DD HH:mm:ss")
    }
}
// formaTime是自定义处理时间的公共方法
// scope.row.regDatetime 作为formaTime方法的参数传入 后端返回的regDatetime是时间戳

经过过滤器就会把时间戳变成YYYY-MM-DD HH:mm:ss格式的标准时间

推荐一个写的比较全面的链接:https://blog.csdn.net/weixin_44299027/article/details/108640181
vue官网链接:
https://cn.vuejs.org/v2/guide/filters.html


http://www.niftyadmin.cn/n/1367431.html

相关文章

关于js/vue字符串截取方法总结

关于js/vue字符串截取方法总结 下面展示一些 内联代码片。 // 例如有这样一个字符串 let str 1234567890; // 返回整个字符串方法 str str.slice(0);//返回整个字符串 1234567890 str str.substring(0);//返回整个字符串 1234567890 str str.substr(0);//返回整个字符串 …

vue+element ui 中国标准化时间转换日期多种格式

vueelement ui 中国标准化时间转换日期多种格式 最近在做项目的时候用到了DatePicker 日期选择器 结果选好日期获取日期value得到这个玩意儿 有点恶心的中国标准化时间 如果想要转化成2021-04-3或/2021/04/30一系列你想要的结果 我是这么写的 你可以作为参考自己改 下面展示一…

vue/js数组转字符串之间的相互转换

vue/js数组和字符串之间的相互转换 // 数组转字符串 let arr [1,2,3] arr.join(,) //变成字符串&#xff0c;并以逗号分隔// 字符串转数组 let str 1,2,3 str.split(,) //字符串按逗号分隔成数组// 温馨提示 以上&#xff08;,&#xff09;可以换成你想要的分割字符

vue 下载模板excle 报错 无法打开

vue 下载模板excle 报错 无法打开 最近有个需求是要下载模板以供后来导入提供样式 效果如图 点击下载后左下角会出现所下载的文件 但是后来报错无法下载 具体解决代码如下&#xff1a; 下面展示一些 内联代码片。 // 划重点 封装接口方法时加上responseTape expoet functi…

一、初入职场

第一次直面社会的小白在线卑微 18年年底正式进入了我的实习生活&#xff0c;那时候的我就是一个肚子里没几滴墨水的穷学生。带着两个同学买了一张特价机票就来到了杭州这个陌生的城市。 刚开始的我们就像无头苍蝇一样&#xff0c;仅仅只是凭着仅有的两个面试邀约就想着自己能闯…

js/elementui 树形结构数据转化(后台平铺返回)

js/elementui 树形结构数据转化&#xff08;后台平铺返回&#xff09; // 后端返回格式 var data [{"id":2,"name":"aaa","pid":null},{"id":3,"name":"bbb","pid":2},{"id":5,&…

SVN版本冲突解决详解

版本冲突原因&#xff1a; 假设A、B两个用户都在版本号为100的时候&#xff0c;更新了kingtuns.txt这个文件&#xff0c;A用户在修改完成之后提交kingtuns.txt到服务器&#xff0c;这个时候提交成功&#xff0c;这个时候kingtuns.txt文件的版本号已经变成101了。同时B用户在版…

vue空格集合

在开发的时候很多时候需要很多间隔 这时候就要用到空格 下面总结一下vue中可以使用的空格 1、&#32 &#xff08;普通的英文半角空格&#xff09; 2、&#160&#xff08;普通的英文半角空格但不换行&#xff09; 3、&#12288 中文全角空格 &#xff08;一个中文宽度…