标签：console 测评 程序 value 单选 下一题 radio select 问卷

radio组件实现单选项目布局

radio | 微信开放文档 (qq.com)

radio group放多个题目

 1.单选的wxml简单布局示例

<view>题目:你是否为毕业设计而感到苦恼？</view>
<radio-group bindchange="radioChange">
  <view>
    <radio value="{{item.value}}"/>
    <text>是</text>
  </view>
  <view>
    <radio value="{{item.value}}"/>
    <text>否</text>
  </view>
</radio-group>

2.将value赋值（1、0记录分值），并打印出来

 3.设置data数据记录问卷单选得分

 data:{
    count:0,
    select:''
  },
  //用户选择了选项
  radioChange(e){
    let select=parseInt(e.detail.value)
    console.log('您的得分是：',select)
    this.setData({
      count:select
    })
  }

 4.完善界面，添加下一题的按钮和对应的点击事件

<button type="primary" bindtap="next">下一题</button>

//下一题跳转
  next(){
    console.log('用户点击了下一题')
  }

实现效果：

 5.用户未做选择给提示

 //下一题跳转
  next(){
    console.log('用户点击了下一题')
    //如果用户没有选择，给提示
    if(!this.data.select){
      wx.showToast({
        icon:'error',
        title: '您还没有选择呢',
      })
    }
  }

标签：console,测评,程序,value,单选,下一题,radio,select,问卷
来源： https://blog.csdn.net/TaylorZ9826/article/details/123092929

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。