如何父母和孩子之間的交流濾波器

Question

//主JS

window.chat = new Vue({ 
    el: '#Chat', 
    components: { 
     chat: Vue.extend(require('./../components/chat/component.vue')) 
    }, 
    filters: { 
     emoji: function(content){ 
      return content; 
     } 
    } 
}) 

//聊天的script.js

module.exports = { 
    components: { 
     message: Vue.extend(require('./../components/message/component.vue')) 
    } 
} 

//消息模板

<span>{{{ message.text | emoji }}}</span> 

這東西給我

app-1.0.4.js:12304 [Vue warn]: Failed to resolve filter: emoji (found in component: <message>) 

我試圖$ root.emoji和$ root.filters.emoji只是爲了嘗試，但沒有奏效。

那麼我該如何做這項工作。我真的想保持在main.js過濾

Answer 1

你可以使用一個混合（https://vuejs.org/guide/mixins.html）：

混入/過濾emoji.js：

module.exports = { 
    filters: { 
     emoji: function(content){ 
      return content; 
     } 
    } 
} 

main.js

window.chat = new Vue({ 
    el: '#Chat', 
    mixins: [ 
     require('./../components/chat/component.vue') 
    ], 
    components: { 
     chat: Vue.extend(require('./../components/chat/component.vue')) 
    }, 
}); 

消息/ component.vue：

module.export = { 
    mixins: [ 
     require('./../components/chat/component.vue') 
    ] 
} 

這是共享某些組件之間過濾器的方法之一。如果您更經常需要它，甚至可以在全球註冊（請參閱文檔https://v1.vuejs.org/guide/custom-filter.html）：

Vue.filter('emoji', function(content){ 
    return content; 
});