react 跳转页面到静态html
时间: 2023-09-05 18:07:32 浏览: 67
在React中,通常使用React Router来进行页面的跳转。不过,如果你要跳转到一个静态HTML页面,可以使用JavaScript的`window.location`对象来实现跳转。
以下是一个示例代码,展示如何在React组件中将页面跳转到一个静态HTML页面:
```jsx
import React from 'react';
function redirectToStaticHTML() {
window.location.href = 'path/to/static.html';
}
function MyComponent() {
return (
<div>
<h1>Hello, React!</h1>
<button onClick={redirectToStaticHTML}>跳转到静态HTML页面</button>
</div>
);
}
export default MyComponent;
```
在上面的代码中,我们定义了一个`redirectToStaticHTML`函数,它会将`window.location.href`设置为你想要跳转的静态HTML页面的路径。然后,在React组件中,我们使用一个按钮来触发这个函数,从而实现页面跳转。
请注意,这种方式是直接跳转到一个新的URL,并加载一个全新的HTML页面。因此,在跳转后,React组件将会被完全卸载,因此不会继续执行或保留状态。如果需要在跳转后保留某些数据或状态,你可能需要使用其他方法,比如使用URL参数、localStorage等。
希望对你有所帮助!如有更多问题,请随时提问。