将 props 传递给 useState React

Question

我正在尝试使用来自 redux 的 props 作为渲染全状态组件的起点，如下所示：

const MyComp = (props) => {

    const initState = {
        newAttribs: [...props.attribs]
        };

    const [state, setState] = useState(initState)
    console.log(state)

};

const mapStateToProps = (fromRedux) => {...};
const mapDispatchToProps = (dispatch) => {...};

export default connect(mapStateToProps, mapDispatchToProps)(React.memo(MyComp));

但如果我console.log(state)它显示空数组，newAttribs即使 ininitState newAttribs在那里。

有人可以阐明如何正确执行此操作吗？谢谢。

编辑：

我在发布代码片段时犯了一个错误，我现在更新了。 显然必须在组件范围之外，而且确实如此const mapStateToProps。const mapDispatchToProps

Answer 1

您需要注意三件事

1. useState 的参数仅在初始加载期间使用一次，并且当 props 更改时状态不会更新
2. mapStateToProps并且mapDispatchToProps应该在组件范围之外定义
3. 当props.attribs更改时，您需要更新组件状态，您可以使用useEffect

例子

const MyComp = (props) => {

    const initState = {
        newAttribs: [...props.attribs]
    };

    const [state, setState] = useState(initState)

    useEffect (() => { 
          setState({ ...state, newAttribs: [...props.attribs] }) 
    }, [props.attribs])
    console.log(state)


};

const mapStateToProps = (fromRedux) => {...};
const mapDispatchToProps = (dispatch) => {...};
export default connect(mapStateToProps, mapDispatchToProps)(React.memo(MyComp));

如果 redux 存储中的数据在初始挂载之前可用，您将在中看到它console.log