let us getting start vue

1、let us getting start vue開頭 很自然地用法 vue 和 vue-router 創(chuàng)建單頁應(yīng)用，當添加 vue-router 到混合器中時，我們已經(jīng)用法組件組合我們的應(yīng)用，我們需要做的就是將組件跟路由映射，讓路由知道如何渲染他們，這里有一個容易的例子： router-link 注重，我們用法自定義組件router-link來創(chuàng)建鏈接，而不是用法常規(guī)的a標志。這允許vue路由器轉(zhuǎn)變url而無需重新加載頁面，處理url生成以及它的編碼。稍后我們將看到如何從這些特性中獲益。 router-view router-view將顯示對應(yīng)于url的組件。你可以把它放在任何地方，以適應(yīng)您的

2、布局。 html 首先我們現(xiàn)在 src/views 創(chuàng)建兩個頁面： home.vue： home export default name: &39;home&39;, data: () => return about.vue： about export default name: &39;about&39;, data: () => return 在 src/router/index.js 添加對應(yīng)的路由： import createrouter, createwebhistory from &39;vue-router&39; co

3、nst routes = path: &39;/about&39;, name: &39;about&39;, component: () => import(&39;./views/about.vue&39;), meta: title: &39;關(guān)于&39; , path: &39;/home&39;, name: &39;home&39;, component: () => import(&39;./views/home.vue&39;), meta: title:

4、 &39;首頁&39; const router = createrouter( history: createwebhistory(process.env.base_url), routes ) export default router 在 src/app.vue 添加 router-link，router-view： go to home go to about app font-family: avenir, helvetica, arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: 2c3e50; nav padding: 30px; nav a font-weight: bold; color: