mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-21 16:00:34 +03:00
rudimentary DOM updating POC
This commit is contained in:
@@ -15,6 +15,22 @@
|
|||||||
|
|
||||||
// set installation inspection flag
|
// set installation inspection flag
|
||||||
VueMeta.install.installed = true
|
VueMeta.install.installed = true
|
||||||
|
|
||||||
|
// listen for when components mount - when they do,
|
||||||
|
// update the meta info & the DOM
|
||||||
|
Vue.mixin({
|
||||||
|
mounted () {
|
||||||
|
this.$root.$updateMeta()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Updates meta info and renders it to the DOM
|
||||||
|
*/
|
||||||
|
Vue.prototype.$updateMeta = function $updateMeta () {
|
||||||
|
const newMeta = this.$meta()
|
||||||
|
document.title = newMeta.title
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Does the grunt work of exposing component meta options
|
* Does the grunt work of exposing component meta options
|
||||||
@@ -30,6 +46,11 @@
|
|||||||
* Recursively traverses each component, checking for a `metaInfo`
|
* Recursively traverses each component, checking for a `metaInfo`
|
||||||
* option. It then merges all these options into one object, giving
|
* option. It then merges all these options into one object, giving
|
||||||
* higher priority to deeply nested components.
|
* higher priority to deeply nested components.
|
||||||
|
*
|
||||||
|
* NOTE: This function uses Vue.prototype.$children, the results of which
|
||||||
|
* are not gauranted to be in order. For this reason, try to avoid
|
||||||
|
* using the same `metaInfo` property in sibling components.
|
||||||
|
*
|
||||||
* @param {Function} Vue - the Vue constructor
|
* @param {Function} Vue - the Vue constructor
|
||||||
* @param {Object} $instance - the current instance
|
* @param {Object} $instance - the current instance
|
||||||
* @param {Object} [metaInfo={}] - the merged options
|
* @param {Object} [metaInfo={}] - the merged options
|
||||||
@@ -38,16 +59,12 @@
|
|||||||
function getMetaInfoDefinition (Vue, $instance, metaInfo) {
|
function getMetaInfoDefinition (Vue, $instance, metaInfo) {
|
||||||
// set default for first run
|
// set default for first run
|
||||||
metaInfo = metaInfo || {}
|
metaInfo = metaInfo || {}
|
||||||
|
|
||||||
// if current instance has a metaInfo option, merge it in
|
// if current instance has a metaInfo option, merge it in
|
||||||
if ($instance.$options.metaInfo) {
|
if ($instance.$options.metaInfo) {
|
||||||
metaInfo = Vue.util.mergeOptions(metaInfo, $instance.$options.metaInfo)
|
metaInfo = Vue.util.mergeOptions(metaInfo, $instance.$options.metaInfo)
|
||||||
}
|
}
|
||||||
|
// check if any children also have a metaInfo option, if so, merge
|
||||||
// check if any children also have a metaInfo option
|
// them into existing data
|
||||||
// NOTE: since the order of $instance.$children cannot be gauranteed,
|
|
||||||
// you should be careful about non-unique meta properties in
|
|
||||||
// sibling components
|
|
||||||
var len = $instance.$children.length
|
var len = $instance.$children.length
|
||||||
if (len) {
|
if (len) {
|
||||||
var i = 0
|
var i = 0
|
||||||
@@ -55,7 +72,6 @@
|
|||||||
metaInfo = getMetaInfoDefinition(Vue, $instance.$children[i], metaInfo)
|
metaInfo = getMetaInfoDefinition(Vue, $instance.$children[i], metaInfo)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return metaInfo
|
return metaInfo
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user