链接按钮到另一个页面
我现在有一个按钮
class Button extends Component{
render(){
return(
<View>
onPress= #I need this to return the second page of my app
<Text style={styles.buttonText}>Next Page</Text>
</View>
)
}
}要将此按钮链接到应用程序的第二页，我应该怎么做？假设我已经导入了页面。
import SecondPage from './SecondPage'回答 3
Stack Overflow用户
发布于 2020-03-02 20:30:50
下面的例子可以解决你的所有问题：
- React路由器Navigation
- Browser刷新问题。
- 浏览器返回按钮问题。
请确保您已安装react-router-dom
如果未安装。使用此命令安装npm i react-router-dom
index.js
import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import Page1 from "./Page1";
import Page2 from "./Page2";
const rootElement = document.getElementById("root");
ReactDOM.render(
<BrowserRouter>
<Switch>
<Route exact path="/" component={Page1} />
<Route path="/page2" component={Page2} />
</Switch>
</BrowserRouter>,
rootElement
);Page1.js
import React from "react";
import {Link } from "react-router-dom";
function Page1() {
return (
<div>
<p>
This is the first page.
<br />
Click on the button below.
</p>
<Link to="/page2"><button>
Go to Page 2
</button>
</Link>
</div>
);
}
export default Page1;Page2.js
import React from "react";
function Page2() {
return (
<div>
<p>This is the second page.</p>
</div>
);
}
export default Page2;Stack Overflow用户
发布于 2017-06-06 21:31:31
使用react-router中的<Link>
<Link to ='/href' ></Link>Stack Overflow用户
发布于 2017-06-06 19:48:53
有两种方法可以实现这一点。详细信息如下
链接选项1:如果您使用的是react路由器，您可以使用将用户重定向到第二个页面。
在路由器配置中声明一条路由，转到第二页并使用。更多详细信息请点击此处http://knowbody.github.io/react-router-docs/api/Link.html
选项2:如果您没有使用react路由器，而只是重定向，请使用按钮上的onClick重定向到新的URL。例如，React: How to navigate via clickHandlers?
注意-选项2是一种从一个页面导航到另一个页面的肮脏方式。一种复杂的方法是使用react-router。当你的应用变得越来越大，页面上发生了很多重定向时，你会需要它。
希望这能有所帮助！
https://stackoverflow.com/questions/44387318
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号