vue循环里面套循环然后里面再套一个

Question

<div>

<div
  :key="item.id"
  v-for="(item, index) in editableTabs"
  :label="item.className"
  :name="item.id"
>
  <div v-for="(list,i) in item.teachers" :key="i">
    <div class="el-tabs__nav-wrap" style="margin:20px 0 30px">分配课程一</div>
    <el-row class="row-bg">
      <el-col :sm="{span:6,offset:1}" :xl="{span:4,offset:2}">
        <el-form-item label="学期:" class="inputbackground">
          <el-input v-model="list.semesteName" readonly="true" placeholder="自动获取"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :sm="{span:23,offset:1}" :xl="{span:22,offset:2}">
        <el-form-item label="课程:">
          <el-checkbox-group v-model="list.courseList" :disabled="!fd_teacher_course">
            <el-checkbox
              v-for="city in courseList"
              :label="city.id"
              :key="city.id"
            >{{city.name}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
      </el-col>
    </el-row>
    <div class="division-line"></div>
  </div>
</div>

</div>

//这里3个循环 我的课程里面的数据 要根据 学期里面的数据获取出来 这个应该怎么写啊,现在courseList是固定死了,我想要courseList这个数据的数据 根据我学期list.semesteName这个调取后台的接口然后得到,courseList应该怎么写呢

Answer 1

你的json数据格式是什么样子？

<el-checkbox
  v-for="city in courseList"
  :label="city.id"
  :key="city.id"
>{{city.name}}</el-checkbox>

遍历数据这个地方需要更改，你说的固定死了没明白什么意思，也没有页面效果展示的截图，这样别人很难回答你的问题的。

v-for="city in list.courseList"

Answer 2

这个就是多了一层而已 那就一层一层往上找 el-input change方法默认有参数 所以需要改一下
@change="(val)=>{handleChange(val,i,index)}"

val就是当前的semesteName 请求回data this.editableTabs[index].teachers[i].courseList=data;
list.courseList就是你要checkbox循环的数据