diff --git a/examples/.babelrc b/examples/.babelrc index 1320b9a..c7e1abb 100644 --- a/examples/.babelrc +++ b/examples/.babelrc @@ -1,3 +1,4 @@ { - "presets": ["@babel/preset-env"] + "presets": [["@babel/preset-env", { targets: { node: "current" } }]], + "plugins": ["dynamic-import-node"] } diff --git a/examples/basic-render/app.js b/examples/basic-render/app.js index e566d75..ed3ee11 100644 --- a/examples/basic-render/app.js +++ b/examples/basic-render/app.js @@ -5,11 +5,16 @@ Vue.use(VueMeta) Vue.component('child', { name: 'Child', - props: ['page'], - render (h) { + props: { + page: { + type: String, + default: '' + } + }, + render(h) { return h('h3', null, this.page) }, - metaInfo () { + metaInfo() { return { title: this.page } diff --git a/examples/keep-alive/app.js b/examples/keep-alive/app.js index bf17f3b..7f95c29 100644 --- a/examples/keep-alive/app.js +++ b/examples/keep-alive/app.js @@ -11,6 +11,14 @@ Vue.component('foo', { }) new Vue({ + data() { + return { showFoo: false } + }, + methods: { + show() { + this.showFoo = !this.showFoo + } + }, template: `
Hello
', - metaInfo: { - title: 'Coucou', - meta: [ - { hid: 'description', name: 'description', content: 'Coucou' } - ] - } - } - } -}) - -renderer.renderToString(vm, function (err, html) { - if (err) throw err - const $meta = vm.$meta().inject() - console.log('Title:\n' + $meta.title.text()) - console.log('\nHTML attrs:\n' + $meta.htmlAttrs.text()) - console.log('\nMeta:\n' + $meta.meta.text()) - console.log('\nHead Script:\n' + $meta.script.text()) - console.log('\nBody Script:\n' + $meta.script.text({ body: true })) -}) diff --git a/examples/vue-router/app.js b/examples/vue-router/app.js index d46b3c8..ee679d0 100644 --- a/examples/vue-router/app.js +++ b/examples/vue-router/app.js @@ -15,7 +15,7 @@ const ChildComponent = {Has metaInfo been updated? {{ metaUpdated }}
`, - metaInfo () { + metaInfo() { return { title: `${this.page} - ${this.date && this.date.toTimeString()}`, afterNavigation() { @@ -27,22 +27,22 @@ const ChildComponent = { return { date: null, metaUpdated - }; + } }, mounted() { setInterval(() => { - this.date = new Date(); - }, 1000); + this.date = new Date() + }, 1000) } } // this wrapper function is not a requirement for vue-router, // just a demonstration that render-function style components also work. // See https://github.com/nuxt/vue-meta/issues/9 for more info. -function view (page) { +function view(page) { return { name: `section-${page}`, - render (h) { + render(h) { return h(ChildComponent, { props: { page } }) diff --git a/examples/vuex-async/store.js b/examples/vuex-async/store.js index 9eb0419..829d247 100644 --- a/examples/vuex-async/store.js +++ b/examples/vuex-async/store.js @@ -35,33 +35,33 @@ export default new Vuex.Store({ // GETTERS getters: { - isLoading (state) { + isLoading(state) { return state.isLoading }, - post (state) { + post(state) { return state.post }, - publishedPosts (state) { - return state.posts.filter((post) => post.published) + publishedPosts(state) { + return state.posts.filter(post => post.published) }, - publishedPostsCount (state, getters) { + publishedPostsCount(state, getters) { return getters.publishedPosts.length } }, // MUTATIONS mutations: { - loadingState (state, { isLoading }) { + loadingState(state, { isLoading }) { state.isLoading = isLoading }, - getPost (state, { slug }) { - state.post = state.posts.find((post) => post.slug === slug) + getPost(state, { slug }) { + state.post = state.posts.find(post => post.slug === slug) } }, // ACTIONS actions: { - getPost ({ commit }, payload) { + getPost({ commit }, payload) { commit('loadingState', { isLoading: true }) setTimeout(() => { commit('getPost', payload) diff --git a/examples/vuex/store.js b/examples/vuex/store.js index dd58b7e..5d67d94 100644 --- a/examples/vuex/store.js +++ b/examples/vuex/store.js @@ -35,27 +35,27 @@ export default new Vuex.Store({ // GETTERS getters: { - post (state) { + post(state) { return state.post }, - publishedPosts (state) { - return state.posts.filter((post) => post.published) + publishedPosts(state) { + return state.posts.filter(post => post.published) }, - publishedPostsCount (state, getters) { + publishedPostsCount(state, getters) { return getters.publishedPosts.length } }, // MUTATIONS mutations: { - getPost (state, { slug }) { - state.post = state.posts.find((post) => post.slug === slug) + getPost(state, { slug }) { + state.post = state.posts.find(post => post.slug === slug) } }, // ACTIONS actions: { - getPost ({ commit }, payload) { + getPost({ commit }, payload) { commit('getPost', payload) } }