如何通过编程方式设置Kendo UI RadioGroup的选项

你可以直接调用 RadioGroup 实例的 setDataSource 方法更新选项列表，无需销毁重建整个组件，该方法是 Kendo UI 数据绑定组件内置的标准 API，会自动触发组件视图刷新，保留原有配置和事件绑定。

实现步骤 #

• 首先获取已经初始化的 RadioGroup 组件实例
• 调用实例的 setDataSource 方法，传入新的选项数据源即可完成更新
• 若需要同时修改选中值，调用实例的 value 方法设置即可

代码示例 #

// 初始化RadioGroup示例（你原有初始化逻辑不变）
$("#radioGroup").kendoRadioGroup({
  dataSource: ["原始选项1", "原始选项2", "原始选项3"],
  value: "原始选项1"
});

// 动态修改选项的逻辑
const radioGroupInstance = $("#radioGroup").data("kendoRadioGroup");
// 传入新的数据源，自动刷新选项列表
radioGroupInstance.setDataSource([
  "新选项A",
  "新选项B",
  "新选项C"
]);
// 可选：设置新的选中值
radioGroupInstance.value("新选项B");

如果你的选项需要区分显示文本和提交值，也支持传入对象格式的数据源：

radioGroupInstance.setDataSource([
  { label: "同意", value: "agree" },
  { label: "反对", value: "disagree" },
  { label: "弃权", value: "abstain" }
]);

该方案比重新生成组件的性能更高，不会丢失原有组件的事件监听、自定义样式等配置，是官方推荐的动态更新数据绑定组件选项的实现方式。

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