What do the: value and: key in the iview selection box refer to?

<Select v-model="model1" style="width:200px">
        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
    </Select>

official website

I don"t quite understand what the document says. I don"t know how to get these two values if I want to output them. What do they represent and what are they used for?

Mar.02,2021

value specifies the value value of the selected project, and data can be bound bidirectionally using v-model. Accept only String or Number, multiple selections only accept Array (v-model binding, that is, which option is determined by value by default)

key is to give Vue a hint so that it can track the identity of each node so that it can reuse and reorder existing elements. You need to provide a unique key attribute for each item


I'll try to explain to you and see if you can understand:
item.label : this is for the user. When the drop-down menu is clicked, there will be an option. The option the user sees is this
value : after you click on a label (option), give the corresponding value to the v-model binding value model1
key : this is equivalent to But it is better to add the recommendation on the official website

.

the above three can all be the same value. For example, all of them can be bound to item.value , depending on how to use them.

I hope my answer will be helpful to you!
Menu