SurveyJS Creator：获取聚焦Choice ItemValue并添加自定义属性

1. 先注册自定义属性（关键步骤） #

要让自定义属性selected_products能被保存到问卷JSON中，必须先给ItemValue类型注册这个属性：

// 初始化Creator前执行
Survey.Serializer.addProperty("itemvalue", {
  name: "selected_products",
  type: "string", // 可根据需求改成array/object等类型
  category: "general",
  visible: true // 在Creator的属性面板中显示该属性
});

2. 监听选中元素变化，捕获聚焦的选项（ItemValue） #

原代码的问题在于错误绑定了事件，且没有正确判断选中的是选项本身。正确的做法是通过onSelectedElementChanged直接判断当前选中的是否为ItemValue（选择题的选项），然后直接操作它的自定义属性：

creator.onSelectedElementChanged.add((sender, options) => {
  const selectedElement = options.newSelectedElement;
  // 判断当前选中的是选择题的选项（ItemValue）
  if (selectedElement.getType() === "itemvalue") {
    // 这里可以直接操作该选项的自定义属性
    // 示例：给当前选中的选项设置selected_products值
    selectedElement.selected_products = "product1,product2";
    
    // 如果需要监听该选项属性变化（比如后续修改）
    selectedElement.onPropertyChanged.add((itemSender, itemOptions) => {
      if (itemOptions.propertyName === "selected_products") {
        console.log("选项的selected_products已更新：", itemOptions.newValue);
      }
    });
  }
});

3. 针对选择题型的额外处理（可选） #

如果需要在用户选中整个选择题后，监听其选项的新增/修改，可以在选中题型时，监听其choices集合的变化，给新添加的选项自动绑定逻辑：

creator.onSelectedElementChanged.add((sender, options) => {
  const question = options.newSelectedElement;
  // 判断当前选中的是目标选择题型
  const targetTypes = ["radiogroup", "checkbox", "dropdown"];
  if (targetTypes.includes(question.getType())) {
    // 监听choices集合的变化
    question.choices.onCollectionChanged.add((choicesSender, choicesOptions) => {
      // 处理新增的选项
      if (choicesOptions.action === "add") {
        const newItem = choicesOptions.newItems[0];
        // 给新选项默认设置自定义属性
        newItem.selected_products = "";
        // 监听该选项的属性变化
        newItem.onPropertyChanged.add((itemSender, itemOptions) => {
          if (itemOptions.propertyName === "selected_products") {
            console.log("选项属性更新：", itemOptions);
          }
        });
      }
    });
  }
});

关键说明 #

• 必须先注册自定义属性，否则修改的属性不会被序列化到问卷JSON中，无法保存。
• Creator中选中选项时，selectedElement会直接指向对应的ItemValue实例，无需通过isFocused属性判断。
• 避免嵌套多层事件监听，容易导致重复绑定或内存泄漏，建议在切换选中元素时清理旧的监听（如果需要）。

内容的提问来源于stack exchange，提问作者amit kundaria