海诗网 知识百科 vue父组件向子组件传递数据(vue父组件向子组件传数据)

vue父组件向子组件传递数据(vue父组件向子组件传数据)

vue父组件向子组件传递数据, vue的父组件如何将数据传递给子组件?不知道小伙伴们今天来看看边肖的分享吧!

vue的父组件向子组件传递数据有四种方法:props和event,ref,provide和inject,vuex。

1, props and events

父组件将道具数据传递给子组件,子组件通过触发事件将数据返回给父组件。代码如下:

//子组件

template

div @click=changeName(YYY){{name}}/div

/template

script

export default{

props:[name],//or props:{name:{type:String,default:}}

methods:{

//不能在子组件中修改props数据,但应该为父组件触发一个事件来处理。

changeName(newName){

this.$emit(changeName,newName)

}

}

}

/script

//父组件

template

div

child-comp :name=name @changeName=changeName/child-comp

/div

/template

script

import childComp from path

export default{

data(){

return {name:XXX}

},

components:{

childComp

},

methods:{

changeName(newName){

this.name=newName;

}

}

}

/scritp

vue父组件向子组件传递数据,以上就是本文为您收集整理的vue父组件向子组件传递数据最新内容,希望能帮到您!更多相关内容欢迎关注。

本文来自网络,不代表海诗网立场,转载请注明出处:https://www.hallse.com/n/169352.html
      

安可电脑和普通电脑的区别(安可国产电脑品牌)

发表回复
联系我们
联系我们

在线咨询: QQ交谈

邮箱: 3587015498@qq.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们
微信扫一扫关注我们
关注微博
返回顶部