mirrors/vue-meta
2
0
Fork 0
mirror of https://github.com/tenrok/vue-meta.git synced 2026-06-13 20:32:24 +03:00
Code Activity

add vue-router example with render function

Browse Source
This commit is contained in:
Declan de Wet
2016-11-07 06:58:57 +02:00
parent 2f6c27b750
commit ebb101d8e7
5 changed files with 64 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/index.html
+1
View File
@@ -9,6 +9,7 @@
<ul>
<li><a href="basic">Basic</a></li>
<li><a href="basic-render">Basic Render</a></li>
<li><a href="vue-router">Usage with vue-router</a></li>
</ul>
</body>
</html>
examples/vue-router/app.js
+53
View File
@@ -0,0 +1,53 @@
import Vue from 'vue'
import VueMeta from 'vue-meta'
import Router from 'vue-router'
Vue.use(Router)
Vue.use(VueMeta)
const ChildComponent = () => ({
name: `child-component`,
props: ['page'],
template: `<h3>You're looking at the <strong>{{ page }}</strong> page</h3>`,
metaInfo: {
title () {
return this.page
}
}
})
function view (page) {
return {
name: `section-${page}`,
render (h) {
return h(ChildComponent(), {
props: { page }
})
}
}
}
const router = new Router({
mode: 'history',
base: '/vue-router',
routes: [
{ path: '/', component: view('home') },
{ path: '/about', component: view('about') }
]
})
const App = {
template: `
<div id="app">
<h1>vue-router</h1>
<router-link to="/">Home</router-link>
<router-link to="/about">About</router-link>
<router-view></router-view>
<p>Inspect Element to see the meta info</p>
</div>
`
}
const app = new Vue(Object.assign(App, { router }))
app.$mount('#app')
examples/vue-router/index.html
+5
View File
@@ -0,0 +1,5 @@
<!DOCTYPE html>
<link rel="stylesheet" href="/global.css">
<a href="/">&larr; Examples index</a>
<div id="app"></div>
<script src="/__build__/vue-router.js"></script>
package.json
+1
View File
@@ -46,6 +46,7 @@
"update-section": "^0.3.3",
"vue": "^2.0.3",
"vue-loader": "^9.7.0",
"vue-router": "^2.0.1",
"webpack": "beta",
"webpack-dev-server": "beta"
},
yarn.lock
+4
View File
@@ -5365,6 +5365,10 @@ vue-loader@^9.7.0:
vue-template-compiler "^2.0.0-rc.3"
vue-template-es2015-compiler "^1.0.0"
vue-router:
version "2.0.1"
resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-2.0.1.tgz#88b83cdc9497bad5b20b579e847a7e7240e221dd"
vue-style-loader@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-1.0.0.tgz#abeb7bd0f46313083741244d3079d4f14449e049"