亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Vue/Bootstrap 復選框,一次只能選中一個

Vue/Bootstrap 復選框,一次只能選中一個

慕的地6264312 2021-09-04 17:23:52
我的 Vue 模板中有兩個復選框:<div class="form-check form-group">        <input v-model="isRecurringTask" class="form-check-input" type="checkbox" value="" id="defaultCheck1">        <label class="form-check-label" for="defaultCheck1">Make this a recurring task</label>    </div>    <div class="form-check form-group">        <input v-model="isScheduledTask" class="form-check-input" type="checkbox" value="" id="scheduleCheck">        <label class="form-check-label" for="scheduleCheck">Schedule a task</label>    </div>它們都可以正常工作并正確調用它們的功能,但是我應該如何正確制作它以便一次只能檢查一個?我想用 Vue 以最合適的方式做到這一點
查看完整描述

2 回答

?
慕少森

TA貢獻2019條經驗 獲得超9個贊

您必須對v-model屬于同一組的所有單選按鈕使用相同的按鈕 - 并為它們提供不同的值:


<template>

<div class="form-check form-group">

  <input v-model.number="typeOfTask" class="form-check-input" type="radio" :value="1" id="defaultCheck1">

  <label class="form-check-label" for="defaultCheck1">

    Make this a recurring task

  </label>

</div>


<div class="form-check form-group">

  <input v-model.number="typeOfTask" class="form-check-input" type="radio" :value="2" id="scheduleCheck">

    <label class="form-check-label" for="scheduleCheck">

      Schedule a task

    </label>

</div>

</template>


<script>

  export default

  {

    data()

    {

      return {

        typeOfTask: null, // 1 = recurring, 2 = scheduled

      }

    }

  }

</script>


查看完整回答
反對 回復 2021-09-04
  • 2 回答
  • 0 關注
  • 990 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號