关于vue.js:vant使用Radio单选

1.开发环境 vue+vant
2.电脑系统 windows10专业版
3.在应用vue+vant开发的过程中,咱们在应用Radio单选组件的时候,可能会存在一些问题,上面我来分享一下遇到的问题,心愿对你有所帮忙。
4.在template中增加如下代码:

<van-popup v-model="show2" position="bottom" :style="{ height: '48%' }">
        <div class="selectCouponsTitle">Select Coupon</div>
        <van-radio-group v-model="radio2">
          <van-cell-group  v-for="(item,index) in CouponsArr" :key="index">
            <van-cell :title="item.title +': '+ item.amount" clickable 
            @click="chenridio(item)" >
              <template #right-icon>
                <van-radio :name="item.id" icon-size="18px" checked-color="#e60012" :label-disabled="true"/>
              </template>
            </van-cell>
          </van-cell-group>
        </van-radio-group>
        <div class="DetermineBtn" @click="closeCouponsList">
          <van-button>Determine</van-button>
        </div>
      </van-popup>
留神:这个 点击事件:
@click="chenridio(item)" // 在这个组件中,这个点击事件只能有一个参数,传 item 是最好的,因为 item 能够拿到所有;当然也能够应用官网的写法,然而集体还是喜爱这样的写法,能够做一个参考,心愿能对你有所帮忙

5.本期的分享到了这里就完结啦,是不是很nice,心愿对你有所帮忙,让咱们一起致力走向巅峰。

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理