【求助】vue如何获取循环出来的component子组件的data值或函数

Question

需求如图：

代码如下：

//template
<component v-for="(plan,i) in item.plan" :ref="'son_'+index+'_'+i" :is="plan.type" :key="i" :pid="index" :id="i" @delete="onPlanDelete"></component>

//data

//tour值
tour:[
  {
    day: 1,
    title: '',
    date: '',
    plan:[]
  }
],
//添加项目的按钮参数，根据type的值，对应相应的component
Options: [
  { 
    type: 'plane',
    name: '机票',
  },
  {
    type: 'sight',
    name: '景点',
  }, {
    type: 'hotel',
    name: '酒店',
  },
  ......更多
]

vue调试工具下，如图：

尝试如下方法去获取子组件，但是不行，求助大家了

getContent(){
    for(var i=0;i<this.tour.length;i++){
      for(var sub=0;sub<this.tour[i].plan.length;sub++){
        var zujian="son_"+i+"_"+sub+"[0]"
        console.log(this.$refs.zujian)
      }
    }
}

Answer 1

var zujian="son_"+i+"_"+sub
console.log(this.$refs[zujian][0])

Answer 2

console.log(this.$refs.zujian)
改成
console.log(this.$refs[zujian])试试

Answer 3

refs='a'；在页面中如果有多个相同的名字，refs.a会变成一个数组，取的时候就是refs.a[0],refs.a[1];

Answer 4

可以在 <component> 中嵌套使用 <component>

Answer 5

把你的代码贴出来吧，看你这几行也不能给你解决啊

vue在线