微信小程序picker组件的简单使用 单选

html 复制代码
<picker mode="selector" range="{{classData}}" bindchange="bindClassChange" value="{{classIndex}}" range-key="className">
  <view class="picker">
    {{classData[classIndex].className || '请选择班级'}}
  </view>
</picker> 

classData是接口请求的数组 如果picker显示的值是[object,object]这样的 range-key="className"

range-key就是重点 修改成你要显示的字段

javascript 复制代码
  //班级选择
  bindClassChange: function (e) {
    const classIndex = e.detail.value;
    this.setData({
      classIndex
    });
  },
相关推荐
zluz_1 小时前
微信小程序,组件中使用全局样式
微信小程序·小程序
明月(Alioo)3 小时前
用AI帮忙,开发刷题小程序:微信小程序中实现Markdown图片解析与渲染功能详解
微信小程序·小程序·aigc
aiguangyuan6 小时前
微信小程序中的双线程模型及数据传输优化
微信小程序·前端开发
说私域8 小时前
技术指数变革下的组织适应性研究:基于定制开发开源AI智能名片S2B2C商城小程序的实践观察
人工智能·小程序·开源
笨笨狗吞噬者8 小时前
【uniapp】小程序体积优化,JSON文件压缩
前端·微信小程序·uni-app
sheji34169 小时前
【开题答辩全过程】以 《基于小程序的校内快递代取服务平台的设计与实现》为例,包含答辩的问题和答案
小程序
小小前端_我自坚强9 小时前
UniApp 微信小程序开发使用心得
面试·微信小程序·代码规范
右子14 小时前
微信小程序开发“闭坑”指南
前端·javascript·微信小程序
江城开朗的豌豆17 小时前
uni-app弹层遮罩难题?看我如何见招拆招!
前端·javascript·微信小程序
江城开朗的豌豆17 小时前
小程序生命周期漫游指南:从诞生到落幕的完整旅程
前端·javascript·微信小程序