title: How does Vue prevent the browser sending request to server after the url in address bar is changed?
body: <p>In a traditional html page, if there is a link <code>&lt;a href='www.xxx.com'&gt;</code> clicked, the page will be redirected to that new page.</p>
  <p>In the <code>Vue</code> applcation, we use <code>Router</code>. Here is the code below.</p>
  <pre><code>Vue.use(Router);
  
  export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
      {
        path: '/',
        redirect: '/heroes',
      },
      {
        path: '/heroes/:id',
        name: 'hero-detail',
        // props: true,
        props: parseProps,
        component: () =&gt;
          import(/* webpackChunkName: &quot;bundle.heroes&quot; */ './views/hero-detail.vue'),
      },
      {
        path: '*',
        component: PageNotFound,
      },
    ],
  });
  </code></pre>
  <p>We open the page in the browser, and it loads the main page. In this page, there is a link button, and <code>this.$router.push</code> will be invoked while the button is clicked.</p>
  <p>After clicking the link button, the url in the browser address bar is chagned. Usually the browser will send a request to the server when the address is chagned. But the browser never sends a request to the server in <code>Vue</code>. How does <code>Vue</code> prevent it?</p>