React中的编程式导航

在React中实现编程式导航，通常我们会使用React Router提供的useHistory钩子。以下是一个简单的例子：




import React from 'react';
import { useHistory } from 'react-router-dom';
 
function NavButton() {
  let history = useHistory();
 
  function handleNavigation() {
    // 当按钮被点击时，导航到指定的路径
    history.push('/destination');
  }
 
  return (
    <button onClick={handleNavigation}>
      导航到目的地
    </button>
  );
}
 
export default NavButton;

在这个例子中，当用户点击按钮时，handleNavigation函数会被调用，该函数使用history.push方法将应用程序的导航位置更改为/destination。这是React中实现编程式导航的一种常见方式。

React中的编程式导航

评论已关闭

推荐阅读