1. 父组件向子组件传值,父组件中定义值,子组件中props来接收
例:父组件中
<div>这是父组件 <child :received='fromParent'/> <div>
子组件中
<div>这是子组件 <p>{{ received }}</p> <div>
<script>
export default{ props:{ received : {type: String,default: ''} } }
</script>
2.子组件向父组件传值,通过事件传递传递数据给父组件
例:子组件中
<div>这是子组件 <input v-model='name' @change='getName'/>
js中: method:{ getName(){ this.$emit('doSometing', this.name)} }
父组件中
<div>这是父组件 <child @doSomething='receiveName'/> {{paramsFromChild}} </div>
js中: method:{ receiveName(data){ this.paramsFromChild = data } } //此处的data,就是上面子组件js中的this.name
3. 子组件向子组件传值
没有直接子对子传参的方法,可将需要传值的子组件合并为一个组件;
也可子组件传到父组件,再从父组件传给另一个子组件;
也可通过定义一个公共的实例文件bus.js,作为中间仓库来传值,详 见 https://blog.csdn.net/lander_xiong/article/details/79018737
使用vuex状态管理,可实现任何组件间的参数传递;