Vue에서 자주 사용하는 filter를

자주사용하는 Vue Filter!!

Masking 관련

모든 문자열 원하는 문자로 마스킹

filter
import Vue from "vue";

Vue.filter("mask", function (value, maskStr = "*") {
    if (!value) {
        return "";
    }

    return maskStr.repeat(value.length);
});
Usage
  • const name = "test";

{{ name | mask}} // **** 로 변환됨

or

{{ name | mask("@")}} //@@@@ 로 변환됨

Date 관련

Date Format 관련

filter
import Vue from "vue";
import moment from 'moment';

Vue.filter("formatDate", (value, format = "YYYY-MM-DD HH:mm:ss") => {
	if (!value) {
		return "";
	}

	return moment(new Date(value)).format(format);
});
Usage
  • const tmpDate = new Date();

{{tmpDate | formatDate}}

or

{{tmpDate | formatDate('YYYY-MM-DD')}}


Related Posts