vue+element 多个checkbox+select思路及方式

HTML:

<el-checkbox-group v-model="re_hotel" class="col-padding">
                  <el-col v-for="(hotel_item, hotel_id) in all_hotel_room" :key="hotel_id" :span="8">
                    <el-checkbox :label="hotel_id" @change="(param) => { return check_hotel_new(hotel_item, hotel_id, param) }">{{ hotel_item.name }}</el-checkbox>
                    <el-select v-model="re_room[hotel_id]" multiple collapse-tags placeholder="全部房型" @change="(param) => { return update_room_select(param, hotel_id)}">
                      <el-option
                        v-for="(room_item, room_id) in hotel_item.room_type"
                        :key="room_id"
                        :label="room_item.room_name"
                        :value="room_item.room_id"
                      />
                    </el-select>
                  </el-col>
                </el-checkbox-group>

 data:

all_hotel_room: {},
      re_hotel: [],
      re_room: {},
      form_apply_room_types: [],

 js:

初始化数据为id对象
getHotelRoomType().then(res => {
        if (res.code === 0) {
          // 初始化房型为id对象

          for (let i = 0; i < res.data.length; i++) {
            if (res.data[i].room_type.length > 0) {
              // this.room_type[i] = []
              this.hotel_room_data[res.data[i].hotel_id] = res.data[i]
              this.all_hotel_room[res.data[i].hotel_id] = res.data[i]
              this.re_room[res.data[i].hotel_id] = []
            }
          }
          console.log('all_hotel_room', this.all_hotel_room)
          console.log('-----', this.hotel_room_data)
          for (let i = 0; i < res.data.length; i++) {
            if (res.data[i].room_type.length > 0) {
              // this.room_type[i] = []
              this.room_type[res.data[i].hotel_id] = []
            }
          }
          console.log(this.room_type)
          res.data.forEach(v => {
            if (v.room_type.length > 0) {
              this.ruleForm.apply_room_types.push(v)
              this.apply_room_new.push(v)
            }
          })
        }
      })

 处理点击checkbox数据：

check_hotel_new(hotel_item, hotel_id, param) {
      if (param) {
        var room_type = hotel_item.room_type

        var roomidArr = []
        for (let i = 0; i < room_type.length; i++) {
          roomidArr.push(room_type[i].room_id)
        }
        this.re_room[hotel_id] = roomidArr
      } else {
        this.re_room[hotel_id] = []
      }

      console.log(hotel_item, hotel_id, this.re_room)
    }

 提交的时候转化为对象：

var all_room_types = []
      this.form_apply_room_types = []
      Object.keys(this.re_room).forEach(hotel_id => {
        if (this.re_room[hotel_id].length) {
          this.form_apply_room_types.push({
            'hotel_id': Number(hotel_id),
            'room_type': this.re_room[hotel_id]
          })
        }

        all_room_types.push(this.re_room[hotel_id])
      })