iview里面加radio和checkbox

 {
          title: '是否启用',
          key: 'transactionisused',
          align: 'center',
          width: 100,
          render:(h, params) => {
            return h( "Checkbox",
              {
                props: {
                  value: params.row.transactionisused === true ? true : false
                },
                on: {
                  "on-change":(val) => {
                    val == true ? params.row.transactionisused = true : params.row.transactionisused = false
                    console.log(val, "-->",params.row.transactionisused);
                  }
                }
              },
              // [
                // h("Checkbox", {
                //   style: {
                //     display: "inline-block",
                //     "font-size": "14px"
                //   },
                //   props: {
                //     label: "是",
                //   }
                // }),
                // h("Checkbox", {
                //   style: {
                //     display: "inline-block",
                //     "font-size": "14px"
                //   },
                //   props: {
                //     label: "不可以",
                //   }
                // })
              // ]
            );
          }
        },
        {
          title: '奖励/抵用积分',//  1:商品销售比例;2:商品固定积分;3:混合模式
          key: 'transactionpattern',
          align: 'center',
          render:(h, params) => {
            return h( "RadioGroup",
              {
                props: {
                  value: params.row.transactionpattern == '1' ? '1' : ( params.row.transactionpattern == '2' ? '2' : '3')
                },
                on: {
                  "on-change":(val) => {
                    val =='1'? params.row.transactionpattern = '1' :  (val == '2' ? params.row.transactionpattern = '2' : params.row.transactionpattern = '3')
                    console.log(val, "改变了",params.row.transactionpattern);
                  }
                }
              },
              [
                h("Radio", {
                  style: {
                    display: "inline-block",
                    "font-size": "14px"
                  },
                  props: {
                    label: "商品售价比例",
                  }
                }),
                h("Radio", {
                  style: {
                    display: "inline-block",
                    "font-size": "14px"
                  },
                  props: {
                    label: "商品固定积分",
                  }
                }),
                h("Radio", {
                  style: {
                    display: "inline-block",
                    "font-size": "14px"
                  },
                  props: {
                    label: "混合模式",
                  }
                }),
              ]);
          }
        },

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
引用和提供了关于iviewradio按钮和点击事件的示例代码。在iview中,可以使用RadioGroup组件和Radio组件来创建radio按钮组件。通过设置v-model属性来绑定数据,通过@on-change事件来触发点击事件。在示例中,当点击单选按钮时,会触发changeModel方法,并通过改变数据来实现相应的逻辑。例如,在的示例中,当点击单选按钮并选择"否"时,会触发changeModel方法,将model.planType置为空。这样就可以实现对radio按钮的点击事件的处理。这是iview中给radio按钮组件点击事件的实例。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [iView 使用 radio 控制下面输入框的显示隐藏](https://blog.csdn.net/weixin_43900414/article/details/116045502)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [iview使用Radio实现单选](https://blog.csdn.net/weixin_41996632/article/details/89360484)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [iviewradio按钮组件点击事件的实例](https://download.csdn.net/download/weixin_38647039/12771795)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值