I user ion-picker component with ionic V4.12, and I have 3 columns. When I select one item of the first column, I need to filter items of the second column, but I cannot find any way to resolve my problem
I found PickerColumn has refresh function ,but still not work
import { PickerController } from '@ionic/angular';
@Component({
...
})
export class ComponentPage {
constructor(public pickerCtrl: PickerController) { }
async openPicker() {
const picker = await this.pickerCtrl.create({
buttons: [{
text: 'Done',
}],
columns: [
{
name: 'days',
options: [
{
text: '1',
value: 1
},
{
text: '2',
value: 2
},
{
text: '3',
value: 3
},
]
},
{
name: 'years',
options: [
{
text: '1992',
value: 1992
},
{
text: '1993',
value: 1993
},
{
text: '1994',
value: 1994
},
]
},
]
});
await picker.present();
}
}
When I select 1 on days column, I just want to show the item named 1994.
I put a request to IONIC TEAM,and the answer is listen ionPickerColChange Even
picker.addEventListener('ionPickerColChange', async (event: any) => {
here handle some logic
}
You can listen to the onDidDismiss method like so:
async openPicker() {
const picker = await this.pickerCtrl.create({
buttons: [{
text: 'Done',
}],
columns: [
{
name: 'days',
options: [
{
text: '1',
value: 1
},
{
text: '2',
value: 2
},
{
text: '3',
value: 3
},
]
},
{
name: 'years',
options: [
{
text: '1992',
value: 1992
},
{
text: '1993',
value: 1993
},
{
text: '1994',
value: 1994
},
]
},
]
});
picker.onDidDismiss().then(({data}) => console.log(data.years.value));
await picker.present();
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.