vueグローバルフィルタ構成
1780 ワード
1つのフィルタがプロジェクトで複数回使用する必要がある場合がある、このフィルタをグローバルフィルタとして定義することができ、グローバルフィルタはmainにある.jsで構成します.時間フィルタを例にとると、ローカルフィルタとして次のように書きます.
グローバルフィルタに設定します
直接定義:Vue.フィルタ('timeForm',function(value){//フィルタコード}
次にフィルタを定義:var timeForm=Vue.filter('timeForm')
使用する場合はローカルフィルタと同様に使用し、直接{value|filter}}でよい
filters: {
timeForm(val) {
if (typeof (value) == "undefined" || value === null) return "";
let date = new Date(value);
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
if (isNaN(y) && y != 0) {
y = " ";
}
if (isNaN(m) && m != 0) {
m = " ";
} else {
(m < 10 ? "0" + m : m);
}
if (isNaN(d) && d != 0) {
d = " ";
} else {
(d < 10 ? "0" + d : d);
}
return y + "-" + m + "-" + d + " " + date.toTimeString().substr(0, 5);
}
グローバルフィルタに設定します
Vue.filter('timeForm', function (value) {
if (typeof (value) == "undefined" || value === null) return "";
let date = new Date(value);
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
if (isNaN(y) && y != 0) {
y = " ";
}
if (isNaN(m) && m != 0) {
m = " ";
} else {
(m < 10 ? "0" + m : m);
}
if (isNaN(d) && d != 0) {
d = " ";
} else {
(d < 10 ? "0" + d : d);
}
return y + "-" + m + "-" + d + " " + date.toTimeString().substr(0, 5);
});
var timeForm = Vue.filter('timeForm');
直接定義:Vue.フィルタ('timeForm',function(value){//フィルタコード}
次にフィルタを定義:var timeForm=Vue.filter('timeForm')
使用する場合はローカルフィルタと同様に使用し、直接{value|filter}}でよい