父组件和子组件的通信

父组件与子组件通信

子传父

子组件将自己的值传给向父组件或者调用父组件中的方法:

子组件中:

this.$emit('事件',[值]) // 触发事件

父组件中:

<标签 @事件 = "父组件方法"></标签>

或者

this.$on('事件',function(){}) // 监听事件

父传子

父组件把自己的值传递给子组件：

props

子组件中：

props: {
    子组件变量: 变量类型
}

父组件中:

<标签 :子组件变量="父组件变量"></标签>

父组件调用子组件中的方法:

父组件中:

ref='子组件名'

父组件methods:

this.$refs.子组件名.子组件方法