Article From:https://segmentfault.com/q/1010000011700589
Question:

When querying the document, it is said that to get the value selected by select, you can use V-model to bind it. But I don’t just choose ID, I need to record ID and name.
Then I found out that the value binding value was the value passed to the V-model binding, so I changed the original: value = “dr.id” to: value = “dr” so that I could pass the currently selected list entire to the v-model, but that’s the problem.Well, no matter which option you choose, select only shows that the last item in the drugs is selected, but the data obtained by V-model is the one I just selected.

No matter which item to choose.

It shows that the last D drug has been selected.

In fact, change just printed out the A drug.

HTML:

<el-select v-model="choosedata"  placeholder="Please select "@change=" selectchange ">";< el-option v-for= "Dr in drugs": key= "dr.id": label= "dr.name"Value= "Dr" > < /el-option>< /el-select>

JS:

data(){
    rutrun{
          choosedata:'',  
          drugs: [
                { id: 1, name: 'ADrugs' ',{id: 2, name:'B drug ',{id: 3, name:'C drug ',{id: 4, name:'D drug '.]}}Methods:{Selectchange () {Console.log (this.choo)Sedata.name);}}

Of course, there is no problem in specifying the display of value= “dr.id” or “value=” dr.name selector.
But it can not achieve the purpose of obtaining two values at the same time.

Answer 0:

If the bound value is object type: need toel-selectAdd upvalue-keyProperty.
value-keyHere can benameperhapsid

el-select

<div id="temp">
    <el-select v-model="choosedata" value-key="id" placeholder="Please select "@change=" selectchange ">";< el-option v-for= "Dr in drugs": key= "dr.id": label= "dr.na"Me: "value=" Dr "> < /el-option>< /el-select>< /div>

Answer 1:

I don’t have much to do, but you must have to specify the components.:valueThe correct value, as you need to get two values, is direct.selectchange(data)In this methoddataTraversing query assignment… (how much to check)

Similar Posts:

Leave a Reply

Your email address will not be published. Required fields are marked *