vue3elementPlus的el-select使用v-for如何设置默认选中项？

Question

el-option选项内容是用v-for从数组循环读取的值，比如说我想设置第一个option为默认选中，或者最后一个为选中，该怎么写呢，谢谢大家了。

Answer 1

将绑定的value赋值v-model变量

  arr: [{name: 1,id: 1},{name:2,id:2}]
  <el-select v-model="sel">
  <el-option v-for="item,index in arr" :key="index" :value="item.id" :label="item.name"></el-option>
  </el-select>
  sel = 1
如果arr 数据id不知道可以
sel = arr[0].id

Answer 2

直接修改 select 组件的绑定值就行了。
比如说

<template>
  <el-select v-mode="value">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
  <el-select>
</template>

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

interface ListItem {
  value: string
  label: string
}
const options = ref<ListItem[]>([])
const value = ref<string[]>([])

const remoteMethod = (query: string) => {
  if (query) {
    fetch(url,params).then(res => {
      options.value = res.data
      loading.value = res.data[0].value
    })
  } else {
    options.value = []
  }
}
</script>