vue 和react中子组件分别如何向父组件传值
Posted qiqi105
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue 和react中子组件分别如何向父组件传值相关的知识，希望对你有一定的参考价值。
vue子组件和父组件双向传值：
子：
Vue.component("childComponent",{
template:`<div><p @click=‘postData‘>向父组件传值:点击我</p>{{result?‘开‘:‘关‘}}</div>`,
props:["result"],
data(){
return{
message:‘从子组件传过来的数据‘
}
},
methods:{
postData(){
this.$emit(‘receiveData‘,this.message)
}
}
});
父：
const app = new Vue({
el: ‘#app‘,
router,
data:{
results:true,//开关状态数据
ChildData:‘‘
},
methods:{
change(){
this.results=!this.results;
},
FromChildData(data){
this.ChildData = data
}
},
components: { App },
template: `
<div id="app">
<p>接收子组件的数据:{{ChildData}}</p>
<childComponent :result="results" @receiveData="FromChildData"></childComponent>
<input type="button" value="change me 开 关" @click="change">
</div>
`
})
react子组件和父组件双向传值：
以上是关于vue 和react中子组件分别如何向父组件传值的主要内容，如果未能解决你的问题，请参考以下文章