element select如何默认选择第三个

2023-08-10 07:57:05 分类：运维技术阅读(478)

在使用element select时，默认选择第三个选项可以通过设置v-model的值来实现。可以在data中定义一个变量，值为第三个选项对应的value，然后将该变量赋给v-model即可。以下是一个示例代码：

<template>
  <div>
    <el-select v-model="selectedOption">
      <el-option
        v-for="(option, index) in options"
        :key="index"
        :label="option.label"
        :value="option.value">
      </el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedOption: '',
      options: [
        { label: '选项一', value: 'option1' },
        { label: '选项二', value: 'option2' },
        { label: '选项三', value: 'option3' },
        { label: '选项四', value: 'option4' }
      ]
    }
  },
  mounted() {
    // 设置默认选择第三个选项
    this.selectedOption = this.options[2].value;
  }
}
</script>

在上面的示例中，通过将data中的selectedOption变量设置为’options’数组中第三个选项的value值，即实现了默认选择第三个选项的功能。

未经允许不得转载：便宜VPS测评 » element select如何默认选择第三个