select框需要同时传label和value值时

<el-select v-model="value" class="m-2" placeholder="Select" size="large">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value"
    />
  </el-select>

<script lang="ts" setup>
import { ref } from 'vue'

const value = ref('')

const options = [
  {
    value: '001',
    label: '小明',
  },
  {
    value: '002',
    label: '小红',
  }
]
</script>

正常情况下一般v-model相当于value的值 只用vaule值传给后台 但有时需要value+label都要传给后台 之前是将value 的值直接改为item整个对象 这样就都可以拿到了 但是会比较麻烦 且编辑回显的时候容易出问题 so 直接更改options的值

state.options = userListToString(data) //data为res返回数组  

function userListToString(data) {
if (data.length > 0) {
return data.map((v) => { 
return v.userName + "(" + v.userNum + ")";
}); 
} else {
return [];
} }