루트 정의

router/index.js

import Home from '/views/Home.vue' //コンポーネント名 from ファイルのパス
import Page from '/views/Page.vue'

 const routes = [
  {
    path: '/',            //urlの末尾を設定
    name: 'Home',         //routeの名前。省略可能。詳しくはrouter-linkのところ
    component: Home       //上でimportした対応させるコンポーネント 大文字に注意！
  },
  { path:'/page',
    name:'firstpage',
    component:Page
  }
]

최초로 읽고 있는 파일은 views의 파일. src/components 쪽이 아니다!

$router.push

<script>
this.$router.push({name:'SerchResult'})   //path:'〇〇'でも可
</script>

router의 기능 중 하나.
다른 url로 천이한다. 쓰는 방법은 다양하다.

router-link

Home.vue

<template>
//下の２つはどちらも同じ！
 <router-link to='/page'>firstpageへのリンク</router-link>

 <router-link :to="{name:'firstpage'}">firstpageへのリンク</router-link>
</template>

아래 코드는 경로보다 이해하기 쉽습니다 (느낌)
약간:이 있거나해서 범 미스하고 있었다. 잘 보면 다르네요.
라우터 링크도 실은 라우터 푸시의 기능을 내부적으로 부르고 있다는 것.
즉, 라우터 링크를 밟는 것으로, 라우터 푸시하고 있다. (공식에서)

라우터 푸시 및 라우터 링크

둘 다 페이지를 전환합니다.

router-link

HTML a 태그와 같은 것. a 태그와 달리 페이지를 전환하지 않으므로 빠르다. 같다.
HTML에 쓰고 사용자가 딸깍하는.
template 안에 쓴다.

router.push

예를 들어, 문의 양식 등에서 제출한 후 "제출이 완료되었습니다!"페이지에 우울 때 사용할 수 있습니다.
만약. 라우터 링크를 사용하면, 유저가 포치와 누르면, 만일 송신할 수 없어도 완료했습니다 페이지로 이동해 버린다.
메소드 안에 쓴다.