支付宝小程序扩展表单 选择输入·PickerItem

选择输入。

扫码体验

示例代码

{
  "defaultTitle": "Picker-item",
  "usingComponents": {
    "list": "mini-ali-ui/es/list/index",
    "picker-item": "mini-ali-ui/es/picker-item/index"
  }
}

<view>
  <list>
    <picker-item
      data-field="bank"
      placeholder="选择发卡银行"
      value="{{bank}}"
      onPickerTap="onPickerTap"
    >
      发卡银行
    </picker-item>
    <picker-item
      data-field="bank"
      placeholder="选择发卡银行"
      value="{{bank}}"
      onPickerTap="onPickerTap"
      layer="vertical"
    >
      发卡银行
    </picker-item>
  </list>
</view>

const banks = ['网商银行', '建设银行', '工商银行', '浦发银行'];


Page({
  data: {
    bank: '',
  },
  onPickerTap() {
    my.showActionSheet({
      title: '选择发卡银行',
      items: banks,
      success: (res) => {
        this.setData({
          bank: banks[res.index],
        });
      },
    });
  },
});

属性

slots