Is there any way to set selected option in Vue DatePicker?

Question

I am using Vue Material - Select component in my vue js project. I want to set the selected value of the component dynamically. I have gone through the documentation https://www.creative-tim.com/vuematerial/components/select and couldn't find the solution I am looking for. Is there any way to carry on this task.

Thank you in advance

Set value in **data** for `v-model` as show in example from documentation: `movie: 'godfather'` — Vasile Radeanu, Sep 16 '21 at 12:41

score 1 · Accepted Answer · answered Sep 16 '21 at 12:53

<template>
  <md-field class="box">
    <label for="movie">Movie</label>
    <md-select v-model="movie" name="movie" id="movie">
      <md-option v-for="opt in options" :key="opt.value" :value="opt.value">
        {{ opt.name }}
      </md-option>
    </md-select>
  </md-field>
</template>

<script>
export default {
  name: "BasicSelect",
  data: () => ({
    movie: "",
    options: [
      { value: "fight-club", name: "Fight Club" },
      { value: "godfather", name: "Godfather" },
      { value: "scarface", name: "Scarface" },
    ],
  }),
  mounted() {
    // Here we set default selected value, you can change it any time
    this.movie = this.options[0].value;
  },
};
</script>

Is there any way to set selected option in Vue DatePicker?

1 Answers1