使用 useHistory 重定向页面并在单击为 false 时删除图像

Posted 2023-03-16

【中文标题】使用 useHistory 重定向页面并在单击为 false 时删除图像

【英文标题】：Redirect pages using useHistory and remove image when click is false

【发布时间】：2021-08-04 00:50:21

【问题描述】：

使用 useEffect 我尝试将正确的序列与右键单击进行比较，如果为真，则自动重定向到另一个页面。如果您犯了四次错误，您将被重定向到松散页面，每个错误都会删除一个图像。如果点击错误，如何重定向页面以及如何删除图像？

useEffect(() => 
const correctSequence = [4, 5, 7, 8, 9];
if (correctSequence === sequence) <Redirect to="/Win" />;
 else <Redirect to="/Loose" />;
console.log(sequence);
console.log(correctSequence);, [sequence]);

Demo

【参考方案1】：

你可以使用 useHistory() 反应钩子。 创建一个函数来检查订单是否正确并使用历史记录。

const history = useHistory();

const correctSequence = [4, 5, 7, 8, 9];

const compare = () => 
  if (correctSequence === sequence)
    history.push("/Win");
   else 
    history.push("/Loose");
  

【讨论】：

太糟糕了，它在这里不起作用，当我尝试单击正确的单词“s，t，a，c，k”时，它不会重定向到 Win。我也尝试了 4 次错误，但它也没有被重定向，而且我点击时图像也没有消失......你知道如何解决这个问题吗？ :(

【参考方案2】：

你不能使用<Redirect />直接从useEffect重定向，你需要：

props.history.push('/Win')

/Loose 也一样。

别忘了用withRouter 包裹你的组件。

【讨论】：

酷不知道，它也可以帮助我正确和错误的逻辑它也不起作用