簡體   English   中英

vue2 + element ui - 如何設置動態 v-model

[英]vue2 + element ui - how to setting dynamic v-model

讓我們將 string(categoryV3) 設為帶有 ',' 的數組,並創建數組長度。 和圖標添加點擊添加..

但是 v-model 不工作..我不知道添加......

我不擅長說英語。

請給我你的意見。

<template>
    <el-table
      :data="tableData"
    >
      <el-table-column type="selection" width="55" align="center"> </el-table-column>
      <el-table-column props="category" label="category" show-overflow-tooltip>
        <template slot-scope="{row}">
          <div v-for="(item, index) in generateArray(row.categoryV3)" :key="index">
            <el-select class="filter-item select1" filterable v-model="item[index]" placeholder="-">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="`${item.value}. ${item.label}`"
                :value="item.value"
              />
            </el-select>
            <span class="tmp-icon icon-add"><i class="el-icon-circle-plus-outline"></i></span>
            <span class="tmp-icon icon-remove" v-show="generateArray(row.categoryV3).length > 1"
              ><i class="el-icon-remove-outline"></i
            ></span>
          </div>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
export default {
  data() {
    return {
     tableData: [{
          categoryV3:"option1,option2"
        }, {
          categoryV3:""
        }],
     options: [{
          value: 'Option1',
          label: 'Option1'
        }, {
          value: 'Option2',
          label: 'Option2'
        }]
    };
  },
  methods: {
    generateArray(val) {
      return val.split(',');
    },
  }
};
</script>
data add 'categoryV3: []'

 <div v-for="(item, index) in categoryV3[scope.$index]" :key="index">
            <el-select class="filter-item select1" filterable v-model="categoryV3[scope.$index][index]" placeholder="-">
              <el-option
                v-for="item in relationCode"
                :key="item.code_value"
                :label="`${item.code_value}. ${item.code_name}`"
                :value="item.code_value"
              />
            </el-select>

            <span class="tmp-icon icon-add" @click="addModel(categoryV3[scope.$index], '')"
              ><i class="el-icon-circle-plus-outline"></i
            ></span>
            <span
              class="tmp-icon icon-remove"
              @click="removeModel(categoryV3[scope.$index], index)"
              v-show="categoryV3[scope.$index].length > 1"
              ><i class="el-icon-remove-outline"></i
            ></span>
          </div>


暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM