2
0
mirror of https://github.com/tenrok/vue-meta.git synced 2026-06-12 08:22:24 +03:00

chore: use metadata instead of meta info

This commit is contained in:
pimlie
2019-03-11 12:38:36 +01:00
parent 80a9654937
commit dc7dd9627f
7 changed files with 10 additions and 9 deletions
+1 -1
View File
@@ -43,7 +43,7 @@
# Introduction
Vue Meta is a [Vue.js](https://vuejs.org) plugin that allows you to manage your app's metadata. It is inspired by and works similar as [`react-helmet`](https://github.com/nfl/react-helmet) for react. However, instead of setting your data as props passed to a proprietary component, you simply export it as part of your component's data using the `metaInfo` property.
These properties, when set on a deeply nested component, will cleverly overwrite their parent components' `metaInfo`, thereby enabling custom info for each top-level view as well as coupling meta info directly to deeply nested subcomponents for more maintainable code.
These properties, when set on a deeply nested component, will cleverly overwrite their parent components' `metaInfo`, thereby enabling custom info for each top-level view as well as coupling metadata directly to deeply nested subcomponents for more maintainable code.
## Documentation
+1 -1
View File
@@ -9,6 +9,6 @@ We would like your help with this! Please visit the [Vue Meta v3.0 rfc](https://
# Introduction
`vue-meta` is a [Vue.js](https://vuejs.org) plugin that allows you to manage your app's metadata, much like [`react-helmet`](https://github.com/nfl/react-helmet) does for React. However, instead of setting your data as props passed to a proprietary component, you simply export it as part of your component's data using the `metaInfo` property.
These properties, when set on a deeply nested component, will cleverly overwrite their parent components' `metaInfo`, thereby enabling custom info for each top-level view as well as coupling meta info directly to deeply nested sub components for more maintainable code.
These properties, when set on a deeply nested component, will cleverly overwrite their parent components' `metaInfo`, thereby enabling custom info for each top-level view as well as coupling metadata directly to deeply nested sub components for more maintainable code.
[Get started](/guide) or play with the [examples](https://github.com/nuxt/vue-meta/tree/master/examples)
+3 -3
View File
@@ -69,8 +69,8 @@ Could be used by third-party libraries who wish to interact with `vue-meta`
### $meta().refresh
- returns [`metaInfo`](/api/#metaInfo-properties)
Updates the current meta info with new meta info.
Useful when updating meta info as the result of an asynchronous action that resolves after the initial render takes place.
Updates the current metadata with new metadata.
Useful when updating metadata as the result of an asynchronous action that resolves after the initial render takes place.
### $meta().inject
- returns [`metaInfo`](/api/#metaInfo-properties)
@@ -437,7 +437,7 @@ The callback receives the following arguments:
{
metaInfo: {
changed (newInfo, addedTags, removedTags) {
console.log('Meta info was updated!')
console.log('Metadata was updated!')
}
}
}
+1 -1
View File
@@ -4,7 +4,7 @@ Short answer, no
On the client, `vue-meta` batches DOM updates using [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame). It needs to do this because it registers a Vue mixin that subscribes to the [`beforeMount`](https://vuejs.org/api/#beforeMount) lifecycle hook on all components in order to be notified that renders have occurred and data is ready. If `vue-meta` did not batch updates, the DOM metadata would be re-calculated and re-updated for every component on the page in quick-succession.
Thanks to batch updating, the update will only occurr once - even if the correct meta info has already been compiled by the server. If you don't want this behaviour, see below.
Thanks to batch updating, the update will only occurr once - even if the correct metadata has already been compiled by the server. If you don't want this behaviour, see below.
:::tip Improvements since v2.0
Previous versions of vue-meta injected lifecycle hooks from the global mixin on all components on the page. Also when refreshing metadata it checked all components on the page
+1 -1
View File
@@ -9,4 +9,4 @@ Add the `data-vue-meta-server-rendered` attribute to the `<html>` tag on the ser
`vue-meta` will check for this attribute whenever it attempts to update the DOM - if it exists, `vue-meta` will just remove it and perform no updates. If it does not exist, `vue-meta` will perform updates as usual.
While this may seem verbose, it _is_ intentional. Having `vue-meta` handle this for you automatically would limit interoperability with other server-side programming languages. If you use PHP to power your server, for example, you might also have meta info handled on the server already and want to prevent this extraneous update.
While this may seem verbose, it _is_ intentional. Having `vue-meta` handle this for you automatically would limit interoperability with other server-side programming languages. If you use PHP to power your server, for example, you might also have metadata handled on the server already and want to prevent this extraneous update.
+1 -1
View File
@@ -4,7 +4,7 @@ If you have an isomorphic/universal web application, you'll likely want to rende
## Add `vue-meta` to the context
You'll need to expose the results of the `$meta` method that `vue-meta` adds to the Vue instance to the bundle render context before you can begin injecting your meta information. You'll need to do this in your server entry file:
You'll need to expose the results of the `$meta` method that `vue-meta` adds to the Vue instance to the bundle render context before you can begin injecting your metadata. You'll need to do this in your server entry file:
**server-entry.js:**
```js
+2 -1
View File
@@ -1,13 +1,14 @@
{
"name": "vue-meta",
"version": "1.5.8",
"description": "Manage page meta info in Vue 2.0 server-rendered apps",
"description": "Manage page metadata in Vue.js components with ssr support",
"keywords": [
"attribute",
"google",
"head",
"helmet",
"info",
"metadata",
"meta",
"seo",
"server",