I'm using of Antd tree component in my react application.
at some point I needed to have custom titles so I added this feature by passing a custom component to "titleRender" prop available on Antd tree component.
Now the issues is when I open the tree (At any level) I get a crazy about of re-render on the treeNode component.=
Open the tree and check the logs here
Is this a natural behavior?
import { Tree } from "antd";
import "antd/dist/antd.css";
const treeData = [
{
title: "parent 1",
key: "0-0",
children: [
{
title: "parent 1-0",
key: "0-0-0",
children: [
{
title: "leaf",
key: "0-0-0-0"
}
]
}
]
}
];
const Title = (props) => {
console.log("render");
return <h5>{props.title}</h5>;
};
export default () => (
<Tree
treeData={treeData}
titleRender={(nodeData) => {
return <Title title={nodeData.title} />;
}}
/>
);