Toggle 实战

我这边就是举例 创建 5 个 Toggle

1 .创建

• 在 Canvas 目录下面 创捷 5 个 Toggle 组件

分别起名叫做 CheckBox1 CheckBox2 CheckBox3 CheckBox4 CheckBox5

• 在 Canvas 目录下面 创捷 5 个 BUTTON 组件

分别起名叫做 Checkbox1Text Checkbox2Text Checkbox3Text Checkbox4Text Checkbox5Text

2. 设置 参数

• CheckBox1 里面 设置参数 是苹果

• CheckBox2 里面 设置参数 是鸭梨

• CheckBox3 里面 设置参数 是香蕉

• CheckBox4 里面 设置参数 是橘子

• CheckBox5 里面 设置参数 是西瓜

• Checkbox1Text 里面 设置参数 是苹果,1

• Checkbox2Text 里面 设置参数 是鸭梨,2

• Checkbox3Text 里面 设置参数 是香蕉,3

• Checkbox4Text 里面 设置参数 是橘子,4

• Checkbox5Text 里面 设置参数 是西瓜,5

3. 代码

• 新建一个空节点.并且创建脚本文件,里面写如下方法

  handleCheckbox(e, customEventData) {
    console.log(e.target);
    console.log(e.isChecked);
    console.log(customEventData);
    if (e.isChecked) {
      this._checkboxData.push(customEventData);
    } else {
      this._checkboxData = this._checkboxData.filter(
        (item) => item !== customEventData
      );
    }
    console.log(this._checkboxData);
  }
  // 点击按钮 操作 checkbox
  buttoncheckbox(e, customEventData) {
    let arr = customEventData.split(",");
    console.log(`Canvas/CheckBoxAll/CheckBox${arr[1]}`); // 你自己对应的路径
    let node = find(`Canvas/CheckBoxAll/Checkbox${arr[1]}`);  // 你自己对应的路径
    let checkbox = node.getComponent(Toggle);
    checkbox.isChecked = !checkbox.isChecked;
  }

4. 给每个 Checkbox 和 Button 绑定事件