注意: 作者尚出于对小程序的摸索结算, 观点和经验会尽量附上依据和出处, 内容的准确性需要自行斟酌. 内容会不断加入, 后续也将持续维护更新.
<picker> 标签
小程序的 picker 有几个主要的属性参数:
- bindchange: 返回发生 change 之后的 index
- value: 当前选中项的 index
- range: 选取项对应的范围
基础用法可以参考文档. 值得注意的是, 这里的 value
和 bindchange
返回的 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 }}"
.
底部弹出框
小程序目前没有原生的底部弹出框, 有一个叫优秀的弹出框实现, 可以用于参考.