將復選框鏈接到 Vue.js 中的列表項

Question

我在“是/否（復選框）”類型的 Sharepoint 中有一個列表元素Scholarship 。

所以，我通過 Vue.js 創建了一個復選框：

<div class="row">
       <div class="d-inline col-lg-6 col-md-6 col-sm-6">
          <b>Scholarship Player</b>
       </div>
       <div class="d-inline col-lg-6 col-md-6 col-sm-6"> {{ this.players.Scholarship }} 
          <input type="checkbox" id="checkbox" v-model="Scholarship"> </div>
       </div>

我遇到的問題是它向我顯示了復選框，並在它旁邊顯示“真”。 當我將列表元素更改為 false 時，它會顯示“false”並且復選框將保持不變。 這意味着它沒有將列表元素“獎學金”鏈接到復選框。

如何將我的列表元素與復選框鏈接/連接？ （這意味着當復選框被選中時，列表元素將為真，而當復選框未被選中時，它將為假）

Answer 1

通過查看代碼，您顯示的值與 v-model 不同。 此外，您不需要“這個”。 在模板部分。

<div class="d-inline col-lg-6 col-md-6 col-sm-6"> {{ players.Scholarship }} 
  <input type="checkbox" id="checkbox" v-model="players.Scholarship"> </div>
</div>