位置: IT常识 - 正文
【Vue】父子组件通信(vue父子组件传值)
编辑：rootadmin推荐整理分享【Vue】父子组件通信(vue父子组件传值)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue 父子组件,vue父子组件生命周期执行顺序,vue中父子组件如何相互调用方法,vue父子组件v-model,vue父子组件传值,vue父子组件的生命周期,vue父子组件通信,vue父子组件传值,内容如对您有帮助，希望把文章链接给更多的朋友！
🚩🚩🚩 💎个人主页: 阿选不出来 💨💨💨 💎个人简介: 一名大二在校生, 不定时更新自己学习道路上的一些笔记. 💨💨💨 💎目前开发的专栏: JS 🍭Vue🍭JS进阶 💨💨💨 💎接上一篇 Vuex 五个核心
组件是 vue.js 强大的功能，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。 根据组件传递数据的方向不同，分为父组件向子组件传值，子组件向父组件传值。
为了深入理解, 我们通过一个案例来更好的理解,首先我们需要两个组件 dropdown.vue(子组件) 和 register.vue(父组件)
实战背景:
子组件是我自己写的一个下拉菜单的样式, 用于父组件中用户完成信息登记.
需要完成的功能有:
父组件向子组件传值(下拉菜单的内容, id值, 当前选项索引值)
子组件向父组件反映选中的内容
附上动图
父组件向子组件传值法一: props父组件
<dropdownVue :selectData="gradeList" id="grade" :current="currentgrade"></dropdownVue>export default {data(){return {gradeList: [2021,2020,2019,2018],currentgrade: null}},}:selectData="gradeList" : 使用 v-bind 绑定要传给子组件的值 gradeList , 值可以是字符串, 数字, 对象, 数组…等
子组件
props
上一篇：手把手带你做一套毕业设计-征程开启(手把手带你做一件事)
下一篇：【Linux】CUDA Toolkit和cuDNN版本对应关系（更新至2022年6月，附官网永久更新链接）(linux安装cuda的正确姿势)