Ant-design tree-select problem

tree select component search for questions.

import React from "react";
import {TreeSelect} from" antd";

const treeData = [{

]
label: "Node1",
value: "0-0",
key: "0-0",
children: [{
    label: "Child Node1",
    value: "0-0-1",
    key: "0-0-1",
}, {
    label: "Child Node2",
    value: "0-0-2",
    key: "0-0-2",
}],

}, {

label: "Node2",
value: "0-1",
key: "0-1",
children: [{
    label: "",
    value: "0-0-1",
    key: "0-0-1",
}, {
    label: "",
    value: "0-0-2",
    key: "0-0-2",
}],

}];

class DataSelectTree extends React.Component {

state = {
    value: undefined,
}
onChange = (value) => {
    console.log(arguments, value);
    this.setState({value});
}

render() {
    return (
        <TreeSelect
            showSearch
            treeCheckable
            style={{width: 300}}
            value={this.state.value}
            dropdownStyle={{maxHeight: 400, overflow: "auto"}}
            treeData={treeData}
            placeholder="json"
            treeDefaultExpandAll
            onChange={this.onChange}
        />
    );
}

}

export default DataSelectTree;

the search only works for individual keywords, such as typing 2, but Filter"s results are also wrong. Figure out how to configure tree-select to make it effective,

Mar.06,2021

you have had this problem for a long time. I used it today, and I also found the problem. Later, I solved it by looking at api.
to use antdesign TreeSelect's search function, you need to know at least three properties, showSearch, filterTreeNode, and treeNodeFilterProp.
whether showSearch: enables search
treeNodeFilterProp: after search is enabled, the treeNode attributes (such as value, title, key)
filterTreeNode: corresponding to the entry Filter are filtered based on the input. By default, the value of treeNodeFilterProp is used as the attribute value of the TreeNode to be filtered.

your problem should be that the treeNodeFilterProp property does not set title,. Antdesign defaults to value.

change your label to title


how to replace label with title with defaultProps: {

            children: 'children',
            label: 'deptName'
        },
Menu