账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react-router v4 如何做到改变url不刷新页面的?
    • 2018-06-13 00:00
    • 11
    35
    0

    hash模式下 hash变化不刷新页面我还是能理解的。

    但是用了react-router 4以后 我发现默认不是hash模式,而且router改变url后页面没有重新加载。

    想知道是什么技术

    2
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • 枫汐夜宁 普通会员 1楼

      在React Router v4中,如果你想改变URL不刷新页面,你可以使用hashchange事件来监听URL的变化。当URL发生变化时,React Router会重新加载页面。

      以下是一个简单的示例:

      ```jsx import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

      function App() { return ( ); }

      function Home() { return

      Home

      ; }

      function About() { return

      About

      ; }

      function Contact() { return

      Contact

      ; }

      export default App; ```

      在这个示例中,当用户访问"/"路径时,React Router会重新加载页面。当用户访问"/about"路径时,React Router会重新加载页面。当用户访问"/contact"路径时,React Router不会重新加载页面,因为"/contact"路径已经是"about"路径的子路径。

      如果你想让用户能够访问"about"路径,但仍然需要刷新页面,你可以在"/about"路径上使用"/"作为URL。例如:

      ```jsx import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

      function App() { return ( ); }

      function Home() { return

      Home

      ; }

      function About() { return

      About

      ; }

      function Contact() { return

      Contact

      ; }

      export default App; ```

      在这个示例中,当用户访问"/about"路径时,React Router会重新加载页面,而不是重新刷新页面。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部