À propos de l'utilisation des filtres dans Vue

Cet article présente principalement l'exemple de code des filtres de filtre Vue et l'utilisation de base du filtre vue. Les amis dans le besoin peuvent s'y référer

Exemple de code

Adoptez le composant de fichier unique vue et utilisez le plug-in moment pour formater la date

<template>
 <p>
  <h1>{{date | dateFormat}}</h1> 
 </p>
</template>
<script>
 import moment from &#39;moment&#39;;
 import &#39;moment/locale/zh-cn&#39;;
 moment.locale(&#39;zh-cn&#39;);
 export default {
  data() {
   return {
    date: new Date()
   }
  },
  filters: {
   dateFormat(val) {
    return moment(val).calendar();
   }
  }
 }
</script>

Effet

3. DescriptionIl n'y a pas cette référence dans le filtre. n'est pas défini, n'essayez donc pas de l'utiliser pour faire référence à des variables ou des méthodes de l'instance de composant dans le filtre.

ps : Jetons un coup d'œil à l'utilisation de base des filtres Vue

ou

// 注册
Vue.filter('my-filter', function (value) {
 // 返回处理后的值
})
// getter，返回已注册的过滤器
var myFilter = Vue.filter('my-filter')

//在mustache中使用
{{ msg | uppercase }}

Ce qui précède est que je l'ai compilé pour tout le monde, j'espère qu'il sera utile à tout le monde à l'avenir.

//在标签中使用
<input type="password" v-model="psw | validate">

Articles connexes :

Comment implémenter une table à l'aide de jQuery+CSS

Comment implémenter un framework de commentaires à l'aide de Vue

À propos des raisons pour lesquelles l'historique de la v4 n'est pas accessible

Pourquoi réponse.body().string() ne peut-il pas être appelé plusieurs fois ?

Comment implémenter un calendrier à l'aide des composants Vue (tutoriel détaillé)

Utiliser Webpack pour créer un échafaudage Vue

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!