0

我正在尝试使用带有动态添加字段的引导表创建一个表。将添加的字段将从我的 api 中获取（参见下面的代码）。

vue.js (jade) -第二个模板将是呈现动态添加字段的模板，但问题是我无法访问 row.item.members，因为我不在行范围内。如果有一种方法可以访问模板标签中的行数据，那就太好了，但我已经花了一天时间，发现没有运气

        b-table(small v-bind:items="plans" v-bind:fields="fields" fixed responsive)
          template(slot='bg_action', slot-scope='row')
            nuxt-link(:to="'/supply_and_demand/master/'+selected+'/'+row.item.date")
              b-button.mr-1(size='sm', variant="primary")
                | {{ row.item.date }}
          template(v-for="member_info in row.item.members" :slot="id_+ 'member_info.id'" )
            | {{ member_info.name }}

我的 api 调用（向表中添加新字段并获取数据）

async fetchData(){
    let params = { 
      "q[balancing_group_id_eq]": this.selected
    }
    this.$restApi.index('bg_members', {params})
    .then( (result)=>{
      this.fields = [
        { key: 'date', label: '' },
        { key: 'bg_action', label: 'BG' }
      ]

      for(let i = 1; i <= result.length; i++){
        this.fields.push({ key: 'id_' + result[i-1].company.id, label: result[i-1].company.name })
      }
    })
    params = { 
      "q[balancing_group_id_eq]": this.selected,
      "q[date_gteq]": this.from,
      "q[date_lteq]": this.to
    }
    this.$axios.$get('/v1/occto/plans', { params })
    .then( (result)=>{
     console.log("plans")
      console.log(this.plans)
      this.plans = result
    })
  }

tldr：我想访问模板标签内的行数据，这样我就可以动态设置槽，这将导致数据正确显示。

4

0 回答 0