Search code examples
vue.jselement-ui

How do set a default value in select option in element UI for Vue?


I am working on a Vue app made with element UI and I have a bunch of el-select whose el-options need to have default values, meaning the form select fields already have one option pre-selected (of course the user can still choose other options). I cannot find any attribute in the official doc https://element.eleme.io/#/en-US/component/select#select But there should be a way to achieve this right?

This is my code

<el-form-item label="some label" prop="someprop">
    <el-select v-model="form.status" filterable clearable>
        <el-option
            v-for="(item, index) in config.status"
            :key="index"
            :label="item"
            :value="index"
            how to have default option here??
            >
        </el-option>
    </el-select>
</el-form-item>

Solution

  • Just put in the form.status the indexes that should be pre-selected. Vue will take care of the rest.

    data(){
       return {
          form: { status: ['thisWillBePreSelected'], },
       }
    }