支付寶小程序擴展表單 選擇輸入·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="選擇發(fā)卡銀行"
      value="{{bank}}"
      onPickerTap="onPickerTap"
    >
      發(fā)卡銀行
    </picker-item>
    <picker-item
      data-field="bank"
      placeholder="選擇發(fā)卡銀行"
      value="{{bank}}"
      onPickerTap="onPickerTap"
      layer="vertical"
    >
      發(fā)卡銀行
    </picker-item>
  </list>
</view>

const banks = ['網(wǎng)商銀行', '建設銀行', '工商銀行', '浦發(fā)銀行'];


Page({
  data: {
    bank: '',
  },
  onPickerTap() {
    my.showActionSheet({
      title: '選擇發(fā)卡銀行',
      items: banks,
      success: (res) => {
        this.setData({
          bank: banks[res.index],
        });
      },
    });
  },
});

屬性

slots