javascript - Vue.js 中从子组件更新父组件

Question

我有一个使用父组件的主组件，该组件有一个使用 v-bind:is="componentName"的动态组件，就像:

父模板:

<li class='list-inline-item g-mx-4 g-mt-10'>
  <component v-bind:is="componentName"></component>
</li>

和代码:

 export default {

    data: function(){
             return  {
               componentName : "componentA"
             },
     },
    components: {
        componentA: {
            template : "<div>A</div>" 
        },
        componentB: {
          template : "  <div>B</div>"
        }
     }

我想切换组件以显示从子组件向componentName发送新值，但我不确定是否必须使用emit或watch或...？

我想在没有 vuex 的情况下做到这一点。

Answer 1

是的，使用发射。 在您的父组件中执行以下操作:

<child-component @custom_event='methodName' />

在子组件的方法中:

this.$emit('custom_event')