vue路由 2018-06-29

打开对应的位置，显示对应的组件。---------------------这就是vue路由所要做的事情

html:           <div id="app">

                       <router-link   to="/">首页</router-link>

                        <router-link  to="/events">活动</router-link>

                       <router-view></router-view>

                    </div>

JS：           const  home={

                  template:'<h2>首页</h2>'

                   }

                   const Event={

                  template:'<h2>活动</h2>'

                   }

                  const routes=【

                   {

                  path：‘/’,

                  component:home

                   }

                  {

                  path：‘/events’,

                  component:Event

                 }

                】

               const  router=new VUErouter({

               routes:routes

               })

               const app=new Vue{

               el:'#app',

               router

              }