视频直播系统源码，react 编程式导航实现页面跳转

视频直播系统源码，react 编程式导航实现页面跳转

1

import React from "react";<br>import {createRoot} from 'react-dom/client';<br>//导入路由的核心组件<br>import {HashRouter, BrowserRouter as Router, Route, Link} from "react-router-dom"<br> <br>class App extends React.Component {<br>    render() {<br>        return (<br>            <Router><br>                <h2>编程式导航app</h2><br>                <Link to="/login">去登录页面</Link><br>                <Route path="/login" component={Login}></Route><br>                <Route path="/home" component={Home}></Route><br>            </Router><br>        )<br>    }<br>}<br> <br>class Login extends React.Component {<br>    fn = () => {<br>        this.props.history.push("./home")<br>    }<br> <br>    render() {<br>        return (<br>            <div><br>                <h2>这是登录页面</h2><br>                <button onClick={this.fn}>登录</button><br>            </div><br>        )<br>    }<br>}<br> <br>const Home = (props) => {<br>    const back=()=>{<br>        //go(-1)表示返回上一个页面<br>        props.history.go(-1);<br>    }<br>    return(<br> <br>        <div><br>            <h2>我是后台首页</h2><br>            <button onClick={back}>返回登录页面</button><br>        </div><br>    )<br>}<br> <br>createRoot(document.getElementById('root')).render(<App/>);

​以上就是视频直播系统源码，react 编程式导航实现页面跳转， 更多内容欢迎关注之后的文章