[Vuejs]-Show a default placeholder in a select VueJS

by

0👍

✅

I was able to get this working by assigning the value to the empty object. Which matches what my default v-model is. I tested it on all my other v-for selects and by putting the DEFAULT/MATCHED value of the v-model the placeholder works fine. Not sure why it was so hard to find an answer online.

 <select v-model="selectedPrescriptionChoice">
           <option :value="{}" selected disabled>
              Choose your saved prescription
            </option>
              <option v-for="pre in prescriptionDataVue" :value="pre.prescriptionData">
                    ${ pre.prescriptionName } - ${ pre.prescriptionDateAdded }
           </option>
    </select>

Leave a comment