[Vuejs]-Dropdown option "selected" not showing in bootstrap / VueJS

0đź‘Ť

The solution was to set the “selected” value in the Vue model, since it is binded by v-model

In my js:

  data: {
    recipes: {},

    newRecipeFormData: {
      recipeName: '',
      recipeNotes: '',
      ingredients: [
        { name: '', weight: '', units: 'ounces' },
        { name: '', weight: '', units: 'ounces' },
        { name: '', weight: '', units: 'ounces' },
        { name: '', weight: '', units: 'ounces' },
        { name: '', weight: '', units: 'ounces' },
        { name: '', weight: '', units: 'ounces' }
      ]
    },
    //…
    syncing: false,
    cloudError: '',
    //…
    recipesModalVisible: false,

  },

Now it’s showing correctly:

enter image description here

Leave a comment