VUE组件传递参数

谁用谁，谁就是父组件

全局组件和局部组件名字冲突时 局部组件会把全局组件顶替掉

父向子传递参数 通过 属性 的方式

父页面向子组件 ul-com 通过属性名 list 传递了一个数组数据
        <ul-com :list="[1,2,3,4]">
子组件通过 props 进行接收数据
        props:{
            list:Array
        }

数据的 父传子 在父组件使用子组件的时候 在子组件的行内标签添加属性
                   在子组件内部 使用 props 接收
                   
// 父组件使用并传递一个qqq
<my-button2 :qqq="123" :aaa="name"></my-button2>

// 子组件接收
props: ["qqq", "aaa"],

子向父传递参数 通过 触发事件 的方式

子组件通过 触发事件 的方式向父组件传递数据
        methods:{
            handleClick(){
                this.$emit("textChange",'来自子组件的数据')
            }
        }
父页面通过 监听事件 的方式来接收数据
        <ul-com :list="[1,2,3,4]" @textChange="handleTextChange">

数据的 子传父 父组件使用子组件的数据 或者 叫 子组件修改父组件的数据
                   通过自定义事件的方式传递; 对应的事件 在子组件中被触发,然后通过传参的方式 把子组件的数据传递给父组件使用

// 父组件
<my-child @mychange="fn"></my-child>
fn(val) {
	// val 就是子组件传进来的数据
	console.log(arguments);
	this.name = val;
}

// 子组件
<button @click="change">修改</button>
change() {
	this.$emit("mychange", this.childName);
}