微信小程序表单如何获取单选框radio选中的值

2021-06-22 10:32 微信小程序 84 梁俊威

做小程序表单类应用单选框的应用应该是使用的比较多的,但是由于官方文档写的非常简约,有一些小伙伴看着就头疼,实例也没几个!

以下是官方给的文档:

微信小程序官方文档-radio

微信小程序官方文档-radio-group

看上去并不怎么感冒,直接上代码吧!

WXML:(因为一开始,根据HTML的习惯来看,只看到了单个radio的选项时,并不知道需要使用radio-group进行成组操作,所以很尴尬的找了很久)

<radio-group bindchange="bindSex">
    <label class="radio">
        <radio name="sex" value="1" checked="true"/> 男
    </label>
    <label class="radio">
        <radio name="sex" value="0" /> 女
    </label>
</radio-group>

WXS:

const app = getApp();
Page({
    data: {
        sex:1,//这里用来获得单选框的值,提交的时候自己获取this.data里的就可以了
    },
    // 这一步骤绑定着radio-group,大致意思你可以认为当在这个单选框组的值有变化时,同时赋予该页面数据变量sex
    bindSex: function(e){
        var sex = e.detail.value==1 ? '男' : '女';
        console.log(sex);
        this.setData({
            sex:e.detail.value
        })
    },
})


若无特殊说明,本站点所有内容均为原创,转载请说明出处!

原文链接:https://www.ljwei.com.cn/read/301.html

QQ客服

QQ客服

微信客服

微信客服

微信客服二维码
意见反馈

意见反馈

一键置顶