该接口用于实现选项选择器。
my.optionsSelect
类似于 safari 原生 select 的组件,但是功能更加强大,一般用来替代 select,或者 2 级数据的选择。注意不支持 2 级数据之间的联动。
效果示例
代码示例
// API-DEMO page/API/options-select/options-select.json
{
"defaultTitle": "选项选择器"
}
<!-- API-DEMO page/API/options-select/options-select.axml-->
<view class="page">
<view class="page-description">选项选择器 API</view>
<view class="page-section">
<view class="page-section-title">my.optionsSelect</view>
<view class="page-section-demo">
<button type="primary" onTap="openOne">单列选择器</button>
</view>
<view class="page-section-demo">
<button type="primary" onTap="openTwo">双列选择器</button>
</view>
</view>
</view>
// API-DEMO page/API/options-select/options-select.js
Page({
openOne() {
my.optionsSelect({
title: "还款日选择",
optionsOne: ["每周一", "每周二", "每周三", "每周四", "每周五", "每周六", "每周日"],
selectedOneIndex: 2,
success(res) {
my.alert({
content: JSON.stringify(res, null, 2),
});
}
});
},
openTwo() {
my.optionsSelect({
title: "出生年月选择",
optionsOne: ["2014年", "2013年", "2012年", "2011年", "2010年", "2009年", "2008年"],
optionsTwo: ["一月", '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
selectedOneIndex: 3,
selectedTwoIndex: 5,
success(res) {
my.alert({
content: JSON.stringify(res, null, 2),
});
}
});
},
});
入参
入参为 Object 类型,属性如下:
名称 | 类型 | 描述 | 必填 | 默认值 |
---|---|---|---|---|
title | String | 头部标题信息 | 否 | 无 |
optionsOne | String[] | 选项一列表 | 是 | 无 |
optionsTwo | String[] | 选项二列表 | 否 | 无 |
selectedOneIndex | Number | 选项一默认选中 | 否 | 0 |
selectedTwoIndex | Number | 选项二默认选中 | 否 | 0 |
positiveString | String | 确定按钮文案 | 否 | 确定 |
negativeString | String | 取消按钮文档 | 否 | 取消 |
success 回调函数
入参为 Object 类型,属性如下:
名称 | 类型 | 描述 | 备注 |
---|---|---|---|
selectedOneIndex | Number | 选项一选择的值 | 若选择取消,返回空字符串 |
selectedOneOption | String | 选项一选择的内容 | 若选择取消,返回空字符串 |
selectedTwoIndex | Number | 选项二选择的值 | 若选择取消,返回空字符串 |
selectedTwoOption | String | 选项二选择的内容 | 若选择取消,返回空字符串 |
文档内容是否对您有帮助?