vue-cli项目中使用全局过滤器及传参
全局过滤器使用一、新建一个js文件,放置过滤器,例如放置main.js同级,新建filters.js(以日期过滤器为例,使用了过滤器传参,如不需要则去掉第二个参数即可,第一个参数需保留)// 过滤日期格式,传入时间戳,根据参数返回不同格式const formatTimer = function(val, hours) {if (val) {var dateTime...
·
全局过滤器使用
一、新建一个js文件,放置过滤器,例如放置main.js同级,新建filters.js(以日期过滤器为例,使用了过滤器传参,如不需要则去掉第二个参数即可,第一个参数需保留)
// 过滤日期格式,传入时间戳,根据参数返回不同格式
const formatTimer = function(val, hours) {
if (val) {
var dateTimer = new Date(val * 1000);
var y = dateTimer.getFullYear();
var M = dateTimer.getMonth() + 1;
var d = dateTimer.getDate();
var h = dateTimer.getHours();
var m = dateTimer.getMinutes();
M = M >= 10 ? M : "0" + M;
d = d >= 10 ? d : "0" + d;
h = h >= 10 ? h : "0" + h;
m = m >= 10 ? m : "0" + m;
if (hours) {
return y + "-" + M + "-" + d + " " + h + ":" + m;
} else {
return y + "-" + M + "-" + d
}
}
}
export {
formatTimer
}
二、再main.js中引入
// 引入全局过滤器
import * as filters from './filters'
Object.keys(filters).forEach(key => {
Vue.filter(key, filters[key])
})
三、直接在项目中使用
<div class="fr">{{item.add_time | formatTimer('hours')}}</div>
四、过滤器传参
如需传参,直接在过滤器后跟参数,在过滤器js中,进行设置,如上(一)
五、效果图
更多推荐
已为社区贡献9条内容
所有评论(0)