Vue selected属性の付与がうまくできない

Question

Vue初心者で、初歩的な質問ですみません。
selectタグの特定のoptionにselected属性を付与したいのですがうまくいきません。

具体的に言うと、下記の「プレミアム」に対してselected属性を付与したいです。

new Vue({
    el: '#app',
    data: {
        selected: {"premium": "プレミアム"},
        planOptions: {"premium": "プレミアム"}
    },
});

...
   <select class="form-control" v-model="plan" v-model="selected">
     <option v-for="(value,key) in planOptions" :key="key" :value="key" v-text="value"></option>
   </select>
...

ご教授よろしくお願いいたします。

Answer 1

https://v3.ja.vuejs.org/guide/forms.html#セレクト

リンク先の内容を参考にしまして、次のような形はどうでしょうか。

  <select class="form-control" v-model="selected">
    <option v-for="option in planOptions" :value="option.value">
        {{ option.text }}
    </option>
  </select>

new Vue({
    el: '#app',
    data: {
        selected: "premium",
        planOptions: [
            { value: "premium", text: "プレミアム" },
        ]
    },
});