美文网首页
小程序踩坑笔记

小程序踩坑笔记

作者: 为谁守专一 | 来源:发表于2017-08-04 13:13 被阅读0次

注意: 作者尚出于对小程序的摸索结算, 观点和经验会尽量附上依据和出处, 内容的准确性需要自行斟酌. 内容会不断加入, 后续也将持续维护更新.

<picker> 标签

小程序的 picker 有几个主要的属性参数:

  • bindchange: 返回发生 change 之后的 index
  • value: 当前选中项的 index
  • range: 选取项对应的范围

基础用法可以参考文档. 值得注意的是, 这里的 valuebindchange 返回的 event.detail.value 都是且只能是元素在 array 中的序号, 即 index 值 (从 0 开始). 即使是我们下面提到的 objectArray 目前也没有发现其他可以用来作为元素 key 的方法.

但是文档中提供的方法只能用于一元数组的显示和选择, 虽然文档提到了 objectArray 的使用, 但是并未清晰地给出明确的使用方式. 如果我们还是按照文档的方法, 只定义 bindchagne, value and range, 会发现所有的选项都是 [object Object] 而非内容, 这是因为对于 picker 而言, 他将 range 被赋值的 objectArray 当作一个普通的一元数组, 取到的自然是整个 object. 正确的使用方法, 需要参考这篇小程序 picker 对于 objArray 怎么取值.

简而言之, 如果是一个 objectArray 类型的数据组, 需要提供一个 range-key 来指定我们需要显示的是这个 object 中某个 key 对应的 value. 另外需要注意, 这里 range-key 的参数必须是这个 key 的名称, 形如 range-key="name", 不需要写成 range-key="{{ name }}".

底部弹出框

小程序目前没有原生的底部弹出框, 有一个叫优秀的弹出框实现, 可以用于参考.

相关文章

  • 小程序踩坑笔记

    注意: 作者尚出于对小程序的摸索结算, 观点和经验会尽量附上依据和出处, 内容的准确性需要自行斟酌. 内容会不断加...

  • 小程序开发踩坑笔记

    movable-area穿透性问题 showActionSheet弹窗操作菜单问题 页面上下分区问题 wxss统一...

  • 小程序资源

    小程序webview踩坑小程序图片转二进制微信基础库对应关系

  • 小程序踩坑

    1.不能在wxss文件background属性中引用本地图片文件2.text标签类似span这种行内标签,不能设置...

  • 小程序踩坑

    开发者开发不同账号的小程序。填写appID,微信根据不同的appID判断该小程序属于哪个账号。 修改数据后不自动渲...

  • 小程序踩坑

    wss图片获取:image.png 2.page.json设置:每一个小程序页面也可以使用.json文件来对本页面...

  • 小程序踩坑

    主要内容 记录小程序开发中碰到的问题以及解决方案 CSS部分 解决小程序按钮border无法清除问题 小程序按钮 ...

  • 我的前端笔记

    目录 react 小程序 vue typescript 经验(踩坑) react useMemo 和 useCal...

  • 微信小程序 踩坑笔记

    1、通过控制台console查数据的方法:getCurrentPages(),返回页面数组,多层页面叠加,最上层的...

  • 【教程】微信小程序入门

    微信小程序入门基础知识 Moustache:我的微信小程序入门踩坑之旅 github精选:微信小程序入门简要教程 ...

网友评论

      本文标题:小程序踩坑笔记

      本文链接:https://www.haomeiwen.com/subject/wcmvlxtx.html