IE中的Vue.js下拉问题

Question

我使用vue.js创建了一个表单，用户可以在其中保存他们的答案并返回。我在我的Vue模板中有一个下拉列表，并且V模型被绑定到一个计算的属性。它在其他浏览器中运行良好，但在IE中，下拉菜单在加载页面时不会显示先前选择的答案。如果他们再次回答，它很好，但我希望他们之前选择的答案显示出来。

<select class="form-control" v-model="answerLocal" @change="updatedAnswer()">
       <option v-for="option in possibleanswers">
             {{option}}
       </option>
</select>

 computed: {
        answerLocal: {
            get: function () {
                if (this.responses && this.responses.length) {
                    return this.responses[0].value;
                }

                return '';
            },
            set: function (val) {
                if (this.responses.length === 0) {
                    this.responses[0] = { value: '' };
                }
                this.responses[0].value = val;
            }
        }

possibleanswers是组件的属性,answerLocal是计算属性。Responsions是组件的属性，包含对象数组。

Answer 1

我终于想出了解决办法。我需要将v-bind:value=“option”添加到HTML中的option标记中。更新的html如下。

<select class="form-control" v-model="answerLocal" @change="updatedAnswer()">
       <option v-for="option in possibleanswers" v-bind:value="option">
             {{option}}
       </option>
</select>