Element-ui framework, the list contains drop-down box questions.

the interface looks like this:

clipboard.png

the list data given by the backend looks something like this:

[
    {
        top:0, //
        down:0, //
        scale:0, //
        ruleUid:1, //id
    },
    {
        top:0, //
        down:0, //
        scale:0, //
        ruleUid:2, //id
    },
]

where rounding rules the data of the drop-down box is given by the backend:

[    
    {
        uid:1,
        name:"-"
    },
    {
        uid:2,
        name:"-"
    },
    {
        uid:3,
        name:"-"
    },
]

my code:

<el-table-column prop="ruleUid" label="">
    <template slot-scope="scope">
        <el-select 
            v-model="value_regular"
            style="width:120px"
            size="small">
            <el-option 
                v-for="item in list_regular"
                :label="item.name"
                :value="item.uid"
                :key="item.uid">
            </el-option>
        </el-select>
    </template>
</el-table-column>

my question:
the list may have 1 line, 2 lines, 3 lines. There are n drop-down boxes on the n-line. However, I only define one variable, vmurmodel = "value_regular". How can I set this variable to be dynamic? That is, a variable stores a drop-down box so that I can easily pass the value when I submit it. Or is there a good solution?


use switch to determine which parameter type the parameter in the function matches.

clipboard.png

clipboard.png

clipboard.png


vMurmodel = "scope.row.xxxx", xxxx is preferably returned from the backend. Even if it is empty, it is all right, there is this field first, and the logic has to be dealt with according to the specific requirements.


<el-table-column prop="ruleUid" label="">
    <template slot-scope="scope">
        <el-select 
            v-model="scope.row.ruleUid" // 
            style="width:120px"
            size="small">
            <el-option 
                v-for="item in list_regular"
                :label="item.name"
                :value="item.uid"
                :key="item.uid">
            </el-option>
        </el-select>
    </template>
</el-table-column>
Menu