So verwenden Sie den Filter in vue.js

So verwenden Sie Filter in vue.js: 1. Definieren Sie einen globalen Filter ohne Parameter, der Code lautet [Vue.filter('msgFormat', function(msg)]; 2. Definieren Sie einen globalen Filter mit Parametern, der Code lautet [Vue. filter('msgFormat', funct].

Die Betriebsumgebung dieses Tutorials: Windows 7-System, Vue-Version 2.9.6. Diese Methode ist für alle Computermarken geeignet.

[Empfohlene Verwandte Artikel: vue.js]

So verwenden Sie Filter in vue.js:

Filter in vue sind in zwei Typen unterteilt: lokale Filter und globale Filter

1. Definieren Sie einen globalen Filter ohne Parameter

       Vue.filter('msgFormat', function(msg) {    // msg 为固定的参数 即是你需要过滤的数据
            return msg.replace(/单纯/g, 'xxx')
       })

Vollständiges Beispiel

    <div id="app">
            <p>{{ msg | msgFormat}}</p>
        </div>
        <script>
            // 定义一个 Vue 全局的过滤器，名字叫做  msgFormat
            Vue.filter(&#39;msgFormat&#39;, function(msg) {
                // 字符串的  replace 方法，第一个参数，除了可写一个 字符串之外，还可以定义一个正则
                return msg.replace(/单纯/g, &#39;xx&#39;)
            })
        </script>

2. Definieren Sie globale Filter mit Parametern

       <div id="app">
            <p>{{ msg | msgFormat(&#39;疯狂&#39;,&#39;--&#39;)}}</p>
        </div>
        <script>
            // 定义一个 Vue 全局的过滤器，名字叫做  msgFormat
            Vue.filter(&#39;msgFormat&#39;, function(msg, arg, arg2) {
                // 字符串的  replace 方法，第一个参数，除了可写一个 字符串之外，还可以定义一个正则
                return msg.replace(/单纯/g, arg+arg2)
            })
      </script>

3. Die Definition und Verwendung lokaler Filter mit und ohne Parameter sind die gleichen wie bei globalen Filtern ist, dass der Filter in der Vue-Instanz definiert ist. Der Bereich, auf den er wirkt, ist auch der Bereich, der von der Vue-Instanz gesteuert wird Gleicher Name, lokal und global, sie werden nach dem Proximity-Prinzip aufgerufen, das heißt, lokale Filter werden vor globalen Filtern aufgerufen

2. Die Ausführungsreihenfolge der Filter muss voneinander getrennt werden Sonstiges. Von links nach rechts

Verwandte Lernempfehlungen: js-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo verwenden Sie den Filter in vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!