Javascript 在打开状态下使用redux时，材质ui对话框闪烁

我试图将“材质ui的打开状态”对话框移动到“重新使用”，以防止在发生重新渲染时关闭该对话框，但在发生重新渲染时该对话框出现问题。虽然状态保存在redux中，并且每当出现重新渲染器时对话框都保持打开状态，但打开状态保持打开状态，但对话框确实显示了打开的动画（淡入），这有点烦人

Students.js（模式的父组件）

const学生=({
应用程序：{studentsPage:{savedaddialogpen}}，
setStudentsPageAddDialogOpen}）=>{
//创建本地州
const[dialogOpen，setDialogOpen]=React.useState（savedaddialogpen）；
const dialogOpenRef=React.useRef（savedaddialogpen）；
//打开“更改重复次数”对话框
const setReduxDialogState=（）=>{
setStudentsPageAddDialogOpen（dialogOpenRef.current，savedAddDialogOpen）；
};
//打开“添加学生”对话框
常量对话框ClickOpen=（）=>{
setDialogOpen（true）；
dialogOpenRef.current=true；
setTimeout（（）=>setReduxDialogState（），300）；
};
//关闭“添加学生”对话框
const dialogClose=（）=>{
setDialogOpen（假）；
dialogOpenRef.current=false；
setTimeout（（）=>setReduxDialogState（），300）；
};
返回(
{/*添加学生模式*/}
)
}
//将此组件的状态设置为全局状态
常量mapStateToProps=（状态）=>({
app:state.app，
});

AddStudentModal.js

const AddStudentModal = ({
    dialogOpen, dialogClose
    }) => {

    return (
      <Dialog
        open={dialogOpen}
      >
        {/* Lots of stuff*/}
        <DialogActions>
          <Button onClick={dialogClose}>
            Close dialog
          </Button>
        </DialogActions>
      </Dialog>
    )
};

const AddStudentModal=({
对话框打开，对话框关闭
}) => {
返回(
{/*很多东西*/}
关闭对话框
)
};

我希望这足够了。我试着在重新启动时检查打开状态是否正确，并且每次都是正确的，但是无论打开状态是什么，对话框在重新启动时看起来都是关闭的，只有几毫秒后才真正注意到它应该打开

任何帮助都将不胜感激

编辑1：发现它与来自redux的打开状态无关，如果我使用open={true}，它仍然闪烁，所以可能是材质ui本身的问题

编辑2:privaterout.js

const PrivateRoute = ({
  auth: { isAuthenticated, loadingAuth },
  user: { loggedInUser },
  component: Component,
  roles,
  path,
  setLastPrivatePath,
  ...rest
}) => {
  useEffect(() => {
    if (path !== '/dashboard' && path !== '/profile') {
      setLastPrivatePath(path);
    }
    // Prevent any useless errors with net line:
    // eslint-disable-next-line
  }, [path]);

  // If we are loading the user show the preloader
  if (loadingAuth) {
    return <Preloader />;
  }

  // Return the component (depending on authentication)
  return (
    <Route
      {...rest}
      render={props =>
        !isAuthenticated ? (
          <Redirect to="/login" />
        ) : (loggedInUser && roles.some(r => loggedInUser.roles.includes(r))) ||
          roles.includes('any') ? (
          <Component {...props} />
        ) : (
          <NotAuthorized />
        )
      }
    />
  );
};

// Set the state for this component to the global state
const mapStateToProps = state => ({
  auth: state.auth,
  user: state.user
});

const privaterote=({
身份验证：{isAuthenticated，loadingAuth}，
用户：{loggedInUser}，
组件：组件，
角色，
路径
setLastPrivatePath，
休息
}) => {
useffect（（）=>{
如果（路径！='/dashboard'&&path！='/profile'）{
setLastPrivatePath（路径）；
}
//防止网络线路出现任何无用错误：
//eslint禁用下一行
}，[path]）；
//如果我们正在加载用户，则显示预加载程序
如果（加载路径）{
返回；
}
//返回组件（取决于身份验证）
返回(
！我被认证了(
)：（loggedInUser&&roles.some（r=>loggedInUser.roles.includes（r）））||
角色。包括（'any'）(
) : (
)
}
/>
);
};
//将此组件的状态设置为全局状态
常量mapStateToProps=状态=>({
auth:state.auth，
用户：state.user
});

多亏了@RyanCogswell，我才发现了这个问题

对于任何有相同问题的人，以下是我的原因和解决方法：

我将组件传递到Route组件中，如下所示：

<PrivateRoute
   exact
   path={'/dashboard/students'}
   component={(props) => (
     <Students {...props} selectedIndex={selectedIndexSecondary} />
   )}
   roles={['admin']}
/>

(
)}
角色={['admin']}
/>

通过这种方式，我可以通过privateRoute函数传递道具，但如果以普通路由组件的方式发送组件，也会发生这种情况

对我来说，解决方案就是将selectedIndexSecondary移动到redux，并以防止重新安装的正常方式发送组件

这样做可以防止这种情况发生

<PrivateRoute
   exact
   path={'/dashboard/students'}
   component={Students}
   roles={['admin']}
/>

---

此外，这将解决组件中的localstates从resetting到默认值的问题。所以对我来说，它解决了两个问题

不，这不是材质UI的问题。您描述的行为不是由重新渲染引起的，而是由重新装载引起的。请在a中重现您的问题，然后其他人将能够更容易地帮助找到重新装载的原因--我在您的问题中当前包含的代码中没有发现任何可能导致此问题的原因，因此原因可能是您尚未包含在问题中的代码。@RyanCogswell什么会导致重新装载，我不可能在不显示所有内容的情况下显示更多的代码。如果你能解释一下是什么原因，也许我能找到一些东西。我看到的最常见的原因是一个功能组件，它是在另一个功能组件中定义的，而不是在顶层定义的。这意味着每当包含组件重新呈现时，嵌套组件将是一种新类型（由于组件的功能被重新定义），这将导致重新安装。示例：，。此问题（嵌套组件定义）可能存在于问题中所示组件周围的代码中的任何位置，因为重新安装祖先组件将导致重新安装所有子组件。我发现了此问题！，谢谢你把我送到正确的方向！我将添加解决方案

<PrivateRoute
   exact
   path={'/dashboard/students'}
   component={Students}
   roles={['admin']}
/>