在一些项目需求中需要父组件向子组件动态传值,比如我这里的需求是,父组件动态通过axios获取返回的图片url数组然后传给子组件,上传图片的子组件拿到该数组后进行遍历并展示图片
方法有两种,
方法一:
props传值,这里注意一个问题,传过来的值需要用watch监听并赋值,否则这里获取到的是空数组
这里把通过后台返回的数组赋值给
this.productImage
,然后把该数组传给子组件定义的props属性src-list
子组件:
this.productImage
,然后把该数组传给子组件定义的props属性src-list然后子组件成功获取到该数组
方法二:
通过ref属性,父组件调用子组件的方法,把要传的数组作为参数传给子组件,子组件获取该参数,并使用
父组件:
子组件:
PS:下面看下vuejs动态组件给子组件传递数据
通过子组件定义时候的props可以支持父组件给子组件传递数据,这些定义的props在子组件的标签中使用绑定属性即可,但是如果使用的是