英文:
Kendo React TreeView CheckBox not working
问题
勾选 TreeView 中的复选框无法正常工作。
这是代码部分。带有复选框节点的 Treeview 在扩展面板内。
<ExpansionPanel
className='item-body-dropDownList'
title={"Expension panel"}
expanded={expanded === item.id}
tabIndex={0}
key={item.id}
onAction={(event) => {
setExpanded(event.expanded ? "" : item.id);
}}
>
<Reveal>
{expanded === item.id && (
<ExpansionPanelContent>
<TreeView
data={processTreeViewItems(tree, {
check: check,
})}
checkboxes={true}
onCheckChange={onCheckChange}
/>
</ExpansionPanelContent>
)}
</Reveal>
</ExpansionPanel>
树数据：
const tree = [
{
text: "Item1",
},
{
text: "Item2",
},
];
onCheckChange 函数：
const onCheckChange = (event) => {
const settings = {
singleMode,
checkChildren,
checkParents,
};
setCheck(handleTreeViewCheckChange(event, check, tree, settings));
};
我尝试从这个网站 https://www.telerik.com/kendo-react-ui/components/treeview/checkboxes/ 实现 TreeView，但它不起作用。
请帮助一下？
英文:
Checking CheckBox inside TreeView is not working.
This is the code. Treeview with CheckBox nodes inside expansion panel.
<ExpansionPanel
className='item-body-dropDownList'
title={"Expension panel"}
expanded={expanded === item.id}
tabIndex={0}
key={item.id}
onAction={(event) => {
setExpanded(event.expanded ? "" : item.id);
}}
>
<Reveal>
{expanded === item.id && (
<ExpansionPanelContent>
<TreeView
data={processTreeViewItems(tree, {
check: check,
})}
checkboxes={true}
onCheckChange={onCheckChange}
/>
</ExpansionPanelContent>
)}
</Reveal>
</ExpansionPanel>
Tree data
const tree = [
{
text: "Item1",
},
{
text: "Item2",
},
];
onCheckChange
const onCheckChange = (event) => {
const settings = {
singleMode,
checkChildren,
checkParents,
};
setCheck(handleTreeViewCheckChange(event, check, tree, settings));
};
I tried to implement TreeView from this web cite https://www.telerik.com/kendo-react-ui/components/treeview/checkboxes/ but its not working.
Any help please?
答案1
得分: 1
你可以在这里看到TreeView的示例实现 - https://codesandbox.io/s/rpkns2?file=/app/main.jsx
而且代码的更多细节将有助于更好地调试此问题。
例如，此方法的实现 - onCheckChange
以及组件ExpansionPanel，Reveal，ExpansionPanelContent
英文:
you can see sample implementation of TreeView from here - https://codesandbox.io/s/rpkns2?file=/app/main.jsx
And some more details of the code would help more to debug this issue.
for ex. the implementation of this method - onCheckChange
and also the components ExpansionPanel, Reveal, ExpansionPanelContent
答案2
得分: 0
我解决了这个问题。我的全局 CSS 覆盖了 CheckBox 的背景颜色，所以我只是改变了背景颜色。
英文:
I solved the problem. My global CSS was overriding background-color of the CheckBox, so I just changed the background-color.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论