Vue.js 选择框不更新v型

我有一个小问题无法解决。我创建了一个这样的选择框

现在自动选择第一个值。但如果我选择了其他值，则v模型不会更新<代码>选定值：始终显示

1

为什么会这样

---

感谢您的帮助。

item.picked

在

Selected value:{{{item.picked}}

中不起作用，因此它只读取装载时的初始值

为了澄清您的一点，v型模型正在更新，但显示未更新

要解决此问题，请使用返回

item.picked

的计算属性

e、 g

• 将

  选定值：{{item.picked}}

  重构为

  选定值：{{{pickedItem}

• 添加计算属性

  pickedItem

计算：{
pickedItem（）{
返回此.item.picked；
}
}

<div id="app">
  Selected value: {{item.picked}}
  <hr />
<select v-model="item.picked">
  <option v-for="(item, index) in item.values" :value="item.value" :key="index">{{item.value}} - {{item.title}}</option>
</select>
</div>

  beforeRouteEnter (to, _from, next) {
            let querypath = `/path/to/api`;

            next (vm => {
                vm.$wait.start ('loading');
                axios
                .get (querypath).then ((resp) => {
                    vm.item = resp.data.data;
                    vm.item.picked = 1;
                    vm.$wait.end ('loading');
                });
            });
        },