Vue.js 基于外部v-for属性设置选项的选定属性

Vue.js 基于外部v-for属性设置选项的选定属性,vue.js,Vue.js,我在v-for中有一个select。选择中的选项基于不同的数据。我尝试了很多方法,但无法正确设置选定的值 <tr v-for="(week,idx) in Picks"> <td>{{ week.start_formatted }}</td> ... <template v-if="week.scenario==5"> <td> <select>

我在v-for中有一个select。选择中的选项基于不同的数据。我尝试了很多方法,但无法正确设置选定的值

<tr v-for="(week,idx) in Picks">
    <td>{{ week.start_formatted }}</td>
    ...
    <template v-if="week.scenario==5">
        <td>
            <select>
                <option v-for="tm in AvailableTeams" v-bind:value="tm.id" selected="{{tm.id === week.team_id}}">
                    {{ tm.name }}
                </option>
            </select>
        </td>
        <td></td>
    </template>
    ...
</tr>

您需要在选择之前添加冒号。在VueJS中,如果编写表达式来设置HTML属性的值,则应使用v-bind:或just:propName

您已经为v-bind:value执行了该操作,但对于selected,您只是错过了该操作

<option v-for="tm in AvailableTeams" v-bind:value="tm.id" :selected="{{tm.id === week.team_id}}">
  {{ tm.name }}
</option>