Vue的子组件如何向父组件传递数据

一、自定义事件

例如，A是父组件，B是子组件，B想给A传数据，那么就要在A中给B绑定自定义事件（事件的回调在A中）。 所以，我们想实现的功能，可以用上自定义事件。

二、代码块部分

1.子组件

js部分(script)---methods中

// 收起菜单
        collapseMenu(){
            this.isCollapse = !this.isCollapse
//利用$emit发送数据
             this.$emit('update',this.isCollapse)
            console.log(this.isCollapse);
        },

2.父组件

html部分(template)

<el-container>
            <el-aside  :width="isShow? '64px' : '200px'"  >
                <CommonAside @update="getData" />
            </el-aside>
            <el-main>Main</el-main>
 </el-container>

js部分(script)

 data() {
        return {
            isShow:'',//存储数据
        }
    },
    methods:{
     //获取子组件的数据
        getData(data){
            this.isShow=data
           // console.log(this.isShow);
        }
    }

三、总结

        第一次做的小练习中是利用vuex实现的，这一次用了props动态传递数据失败了，于是用上了$emit.