Vue组件之间传值/调用方法的几种方式

1.在父组件中使用子组件的地方绑定数据

<children :message="message"></children> 

2.子组件使用props接收父组件传过来的数据

props:{      message:String } 

3.示例：

1.子组件直接使用$emit将内部数据传递给父组件

this.$emit("childByValue",this.childValue); 

2.父组件中接收数据

<template>      <child @childByVlaue="childByVlaue"></dhild> </template> methods:{      childByValue:function(childValue){           this.name=childValue;      } }   

(三)可以通过

p

a

r

e

n

t

和

parent和

parent和children获取父子组件参数

$children[i].params  this.$parent.params 

1.在state里定义数据和属性

state: {     userName: '',   }, 

2.在mutation里定义函数

mutations: {     setUserName(state, name) {       state.userName = name     }, }, 

3.设置值

this.$store.comit('setUserName',params) 

4.获取值

this.$store.state.user.userName 

1.子组件的方法

methods:{      childMethod(){           alert("我是子组件的方法");      } } 

2.父组件调用子组件的方法

<template>      <child ref="child"></child>      <div @click="parentMethod"></div> </template> methods:{      parentMethod(){           this.$refs.child.childMethod();      } }