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

66次阅读

共计 846 个字符,预计需要花费 3 分钟才能阅读完成。

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, 心愿对你有所帮忙, 让咱们一起致力走向巅峰。

正文完
 0