在 Vue.js 中从子组件更新父组件

非可乐

我有一个使用 Parent 组件的主组件,它有一个使用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发送新值,但我不确定是否必须使用发射或观察或...?

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

洛伊克

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

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

在子组件的方法中:

this.$emit('custom_event')

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在 vue.js 中从子组件更改父组件

来自分类Dev

从子组件更新数据 - Vue.js/Axios/Laravel

来自分类Dev

在Vue.JS的父组件中创建子组件

来自分类Dev

在Vue.JS的父组件中创建子组件

来自分类Dev

从子组件修改 vue app main.js 中的值

来自分类Dev

将事件从子组件提升到 Vue.js 中的容器组件?

来自分类Dev

Laravel 6和Vue.js使用vue-router和axios从子组件更新记录

来自分类Dev

在子组件具有项目列表的情况下,触发/更新在Quasar / Vue中从子组件更改为父组件的数据

来自分类Dev

Vue.js 组件父事件

来自分类Dev

组件 Vue.js 中的渲染组件

来自分类Dev

将数据从Vue.js中的父组件传递到动态组件

来自分类Dev

如何在父组件中使用Vue.js子组件中的数据?

来自分类Dev

Vue js 中的递归组件

来自分类Dev

Vue.js:从中的父组件触发子组件的@click

来自分类Dev

Vue.js 中的 Eventbus 没有更新我的组件

来自分类Dev

React JS:从子对象渲染父组件

来自分类Dev

更改根组件中的值时,不会更新子组件中的Vue.js props值

来自分类Dev

vue js的组件继承

来自分类Dev

从Vue.js中的父对象访问组件数据结构

来自分类Dev

Vue.js:方法在发射后未在父组件中触发

来自分类Dev

Vue.js在组件中获取元素

来自分类Dev

Vue.js组件中的高图

来自分类Dev

Vue.js在组件中获取元素

来自分类Dev

在vue.js中渲染动态组件?

来自分类Dev

Vue.js中的动态导航组件

来自分类Dev

vue.js中组件之间的通信

来自分类Dev

在 vue.js 组件中操作 props

来自分类Dev

Vue JS 在组件中设置数据收集

来自分类Dev

如何从Vue.js的子组件访问父方法?