Namespace: How to use Select

Members

(constant) Dynamic Binding Options

In the event callback , you can modify the options by changing the optionItems property 【Starting from version 1.1.0, you can function this feature in the Appearance panel.】

Example

# 1.There is a RAPID variable in your controller like below:
    PERS num myArray{3}:=[3,2,1];
# 2.onCreated : monitor the RAPID variable and update the optionItems property
    API.VARIABLEMONITOR.monitorVariable(
      {
        type: 'num',
        task: 'T_ROB1',
        module: 'BASE',
        name: 'myArray',
      },
      (vvv) => {
        const arr = JSON.parse(vvv)
        this.optionItems = arr.map(item => `${item}|${item}`).join(';')
        // 3|3;2|2;1|1
      },
    );

(constant) Update Index

You can obtain the component instances by using the Instance variable and modify the selectedIndex property. Only the first-level nodes in the web app are automatically attached to the Instance variable. From version 1.1.0, you can configure this function in the Appearance panel.

Example

# update the value of the Select but from somewhere else.
      Instance.Select_1.selectedIndex = 1

(constant) Update Rapid After Change

You can obtain the current value of the component when editing its onChange callback event, and then use the value to update RAPID variable.

Example

# 1. There is a RAPID variable in your controller like below:
      PERS num selected:=3;
# 2.onChange : Update the RAPID variable according to the current value of the selected component.
      await API.RAPID.setVariableValue('BASE','selected',this.value,"T_ROB1",{
        syncPers: true,
      })