0

我在从 ReactDropdownTreeSelect 恢复值时遇到各种麻烦。该组件似乎保持它的状态很好，直到我想保存更改的结果。但是我尝试这样做，组件失去了它的状态并且没有选择任何内容。我错过了什么

这是一个最简单的示例，与帮助中的示例几乎相同，它显示了问题。一行就断了...

import React, { useState, useEffect } from "react"
import DropdownTreeSelect from "react-dropdown-tree-select"

function DebugSelector() {
    const [mySelected, setMySelected] = useState([]);
    const [lastChanged, setLastChanged] = useState({});

    const tarifs = {
        label: "all tarifs", value: "all", children: [
            { label: "second level tarif", value: "secondLevel" },
            { label: "another 2nd level", value: "secondLevel2" }
        ]
    }
    const onChange = function (currNode, selectedNodes) {
        debugger
        // Any of these lines will break it. The component loses its state.
        //setMySelected(selectedNodes);
        //setMySelected([...selectedNodes]);
        //setLastChanged(currNode);
        setLastChanged(JSON.parse(JSON.stringify(currNode)))
    }
    return (
        <DropdownTreeSelect data={tarifs} onChange={onChange}></DropdownTreeSelect>
    )
}
export default DebugSelector;
4

1 回答 1

0

它看起来像setLastChanged没有定义，所以它会产生一个错误。

此外，如果您调用setMySelected组件将被重新渲染并基于代码，DropdownTreeSelect没有带有更新值的道具，我认为您应该做的是tarifs在任何更改完成时进行更新，因此，类似于：

const [tarifs, setTarifs] = useState({
  label: foo, value: bar, children: [baz]
})

const onChange = function (currNode, selectedNodes) {
  setTarifs(currNode);
}

return <DropdownTreeSelect data={tarifs} onChange={onChange}/>;
于 2021-11-22T14:44:27.350 回答