Uniapp 组件传递参数(八)

组件传递参数

  • 父传子 传递参数 通过属性的方式

  • 子向父传递参数 通过触发事件的方式

  • 使用全局数据传递参数

(1) 通过挂载到 vue 的原型上

(2) 通过 globalData 的方式

父组件向子组件传递参数

  • 通过属性名 list 传递一个数组数据

  • 子组件通过 props 进行接收数据

<!--父组件-->
<Hello :data="哈哈哈"></Hello>

<!--子组件js代码-->
props:['list']

<!--子组件component-->
<p>{{ data }}</p>

子组件向父组件传递数据

  • 子组件通过触发事件的方式向父组件传递数据

  • 父组件通过监听事件的方式来接收数据

  • 通过发射


//子组件发射
methods:{
  handleClick(){
    this.$emit("changemodel",'来自子组件的数据')
  }
}
//父组件监听

<ul-com :list="[1,2,3,4]"
@changemodel = "handlechange"
>
</ul-com>

// 然后方法里面写handlechange方法


文章作者: 雾烟云
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 雾烟云 !
  目录