my.optionsSelect
A component similar to the native Safari select
but with more powerful features, which you can use to replace the native select
or level 2 data. Note: The component does not support interactions among level 2 data.
Effect
Sample code
// API-DEMO page/API/options-select/options-select.json
{
"defaultTitle": "Option selector"
}
<!-- API-DEMO page/API/options-select/options-select.axml-->
<view class="page">
<view class="page-description">Option selector API</view>
<view class="page-section">
<view class="page-section-title">my.optionsSelect</view>
<view class="page-section-demo">
<button type="primary" onTap="openOne">Single column selector</button>
</view>
<view class="page-section-demo">
<button type="primary" onTap="openTwo">Double column selector</button>
</view>
</view>
</view>
// API-DEMO page/API/options-select/options-select.js
Page({
openOne() {
my.optionsSelect({
title: "Select the repayment date",
optionsOne: ["Every Monday", "Every Tuesday", "Every Wednesday", "Every Thursday", "Every Friday", "Every Saturday", "Every Sunday"],
selectedOneIndex: 2,
success(res) {
my.alert({
content: JSON.stringify(res, null, 2),
});
}
});
},
openTwo() {
my.optionsSelect({
title: "Select the year and month of birth",
optionsOne: ["2014", "2013", "2012", "2011", "2010", "2009", "2008"],
optionsTwo: ["January", 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
selectedOneIndex: 3,
selectedTwoIndex: 5,
success(res) {
my.alert({
content: JSON.stringify(res, null, 2),
});
}
});
},
});
Parameters
The input parameters are in Object type and have the following attributes:
Name | Type | Description | Required | Default value |
title | String | Header title information | No | - |
optionsOne | String[] | List for option one | Required | - |
optionsTwo | String[] | List for option two | No | - |
selectedOneIndex | Number | It means option one is selected by default. | No | 0 |
selectedTwoIndex | Number | It means option two is selected by default. | No | 0 |
positiveString | String | The text that is displayed on the Confirm button | No | Confirm |
negativeString | String | The text that is displayed on the Cancel button | No | Cancel |
Callback function upon success
The input parameters are in Object type and have the following attributes:
Name | Type | Description | Remarks |
selectedOneIndex | Number | Selected value in option one | If you cancel the selection, an empty string will be returned. |
selectedOneOption | String | Selected content in option one | If you cancel the selection, an empty string will be returned. |
selectedTwoIndex | Number | Selected value in option two | If you cancel the selection, an empty string will be returned. |
selectedTwoOption | String | Selected content in option two | If you cancel the selection, an empty string will be returned. |