如何父母和孩子之间的交流滤波器

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; 
});