Question

我之前也曾问过类似的问题，但是现在主要问题已经改变：

我有两行离子选择器，第二行的值完全取决于您在第一行中选择的内容。现在，我可以更改选择一个选项时接收到的值，但是选择器不会更新，因此，即使使用了其他值，仍会显示旧值，这是一个很大的问题。

在上一个问题中得到的答案中，我被告知有一个名为forceUpdate（）的函数，但是当我尝试该函数时，它什么也没有改变。有人告诉我说它可能仍在开发中，甚至可能在不久的将来被删除，但是我需要知道是否有一种方法现在可以更新离子选择器。

以下是离子选择器的代码：

async showJetPicker(id) {
    if (this.disabledis[id - 6] !== true) {
    const opts: PickerOptions = {
      cssClass: 'academy-picker',
      buttons: [
        ...
      ],
      columns: [
        {
          name: '1st row',
          options:  this.convertColumns(this.pickerbois[id].options[0])
        },
        {
          name: '2nd row',
          options:  this.convertColumns(this.pickerbois[id].options[1])
        }
      ]
    };
    const picker = await this.pickerCtrl.create(opts);
    picker.addEventListener('ionPickerColChange', async (event: any) => {
      const data = event.detail;
      const colSelectedIndex = data.selectedIndex;
      const colOptions = data.options;
      if (colSelectedIndex < 2) {
        picker.columns[1].options = this.convertColumns(this.pickerbois[id].options[colSelectedIndex + 1]);
        picker.forceUpdate();   //Here it should update the picker
      }
    });
    this.picker_cancer = picker;
    picker.present();
    }
  }

Answer 1

请尝试以下操作，该操作会修复我的问题。

async showJetPicker(id) {
  if (this.disabledis[id - 6] !== true) {
  const opts: PickerOptions = {
    cssClass: 'academy-picker',
    buttons: [
      ...
    ],
    columns: [
      {
        name: '1st row',
        options:  this.convertColumns(this.pickerbois[id].options[0])
      },
      {
        name: '2nd row',
        options:  this.convertColumns(this.pickerbois[id].options[1])
      }
    ]
  };
  const picker = await this.pickerCtrl.create(opts);
  picker.addEventListener('ionPickerColChange', async (event: any) => {
    const data = event.detail;
    const colSelectedIndex = data.selectedIndex;
    const colOptions = data.options;
    let temColumns;
    if (colSelectedIndex < 2) {
      //picker.columns[1].options = this.convertColumns(this.pickerbois[id].options[colSelectedIndex + 1]);
      //picker.columns[1].options = this.convertColumns(this.pickerbois[id].options[colSelectedIndex + 1]);
      
      temColumns = this.convertColumns(this.pickerbois[id].options[colSelectedIndex + 1]);        
      picker.columns[1].options = JSON.parse(JSON.stringify(temColumns));
      
      picker.forceUpdate();   //Here it should update the picker
    }
  });
  this.picker_cancer = picker;
  picker.present();
  }
}

是否可以更新离子选择器及其值？

1 个答案: