How to set default value for the v-model in Vue, when v-model is based on backend response?-CodePudding

How can I set default value from the data in the following component v-model which is working inside loop?

<MultiSelect
              v-model="item.displayOptions.size"
              :options="sizeOptions"
              label="Size"
              trackBy="id"
              labelField="name"
              :noLabel="true"

            ></MultiSelect>

I need to set default value sizeOptions[1] when there is no property coming from the backend for the v-model value? How can it be achieved?

CodePudding user response：

you have to use an object consist of trackBy that you set that here is id :

for example defaultValue data:

defaultValue: {
    id: "Your id",
    title: "Your title"
    ...
}

CodePudding user response：

Try this

<MultiSelect
  v-model="item.displayOptions.size" // Set this variable is 1
  :options="sizeOptions || [1]"
  label="Size"
  trackBy="id"
  labelField="name"
  :noLabel="true"
></MultiSelect>