属性更改后，React 组件不会重新渲染

Question

今天在 SorninHeadachePost 中，我们有一个新的 React 渲染，但没有发生。

我将尽力解释并提供尽可能多的信息（如果您认为缺少某些内容，请不要犹豫）。

所以 ！

我有一个名为 Navigation 的 React 组件，一旦 props 更改，它应该重新渲染。

    //[...]
    const [availableViews, setAvailableViews] = useState(props.availableViews)
    const [userViews, setUserViews] = useState(props.userViews)
    const [_, forceUpdate] = useReducer((x) => x + 1, 0);

    useEffect(() => {
        setAvailableViews(props.availableViews)
    }, [props.availableViews])

    useEffect(() => {
        setUserViews(props.userViews)
        console.log("the log")
        forceUpdate()
    }, [props.userViews])

    return (
        <div className="navigation-root">
                <div className="navigation-title">
                    <img src={dashboardSVG} alt="Dashboard"/>
                    <span className="navigation-titleSpan">DASHBOARD</span>
                </div>
                <div className="navigation-tabContainer">
                    {
                        props.dataInitialized && availableViews.length > 0
                            ?
                            availableViews.map((d:ViewObject, key:any) => {
                                if (d.viewName.startsWith("Default ")) {
                                    let views: ViewObject[] = []
                                    for (let i = 0; i<userViews.length;i++) {
   //[...]

在此表示 React 组件 Navigation 的代码片段中，属性 userViews 在用户操作时发生更改，抛出日志 (the log)在这个动作上，所以 prop 被更新。

但没有任何变化......

可能是因为使用状态 userViews 的逻辑被包装到 .map 回调中。 （如果是因为这个，怎么可能重新渲染）

如你所见，我尝试了减速器的 hack 来强制更新。也没有任何改变。

此时，我正在寻找该组件的完整重新渲染，以便它更新所有子组件。