Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-12-03 19:07:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix hot reloading for layout

Browse Source
This commit is contained in:
Sébastien Chopin 2016-12-24 14:15:00 +01:00
parent 3a0fcdee73
commit 3f220625b9
2 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
lib/app/App.vue
View File

@ -14,12 +14,14 @@ layoutsKeys.forEach(function (key, i) { %>
} }
export default { export default {
data () { data: () => ({
return { layout: null } layout: null,
}, layoutName: ''
}),
methods: { methods: {
setLayout (layout) { setLayout (layout) {
if (!layout || !layouts['_' + layout]) layout = 'default' if (!layout || !layouts['_' + layout]) layout = 'default'
this.layoutName = layout
let _layout = '_' + layout let _layout = '_' + layout
if (typeof layouts[_layout] === 'function') { if (typeof layouts[_layout] === 'function') {
return this.loadLayout(_layout) return this.loadLayout(_layout)

25
lib/app/client.js
View File

@ -121,7 +121,8 @@ function render (to, from, next) {
if (Component._data && typeof Component._data === 'function') { if (Component._data && typeof Component._data === 'function') {
var promise = promisify(Component._data, context) var promise = promisify(Component._data, context)
promise.then((data) => { promise.then((data) => {
Component.options.data = () => data || {} Component._cData = () => data || {}
Component.options.data = Component._cData
Component._dataFn = Component.options.data.toString().replace(/\s/g, '') Component._dataFn = Component.options.data.toString().replace(/\s/g, '')
if (Component._Ctor && Component._Ctor.options) { if (Component._Ctor && Component._Ctor.options) {
Component._Ctor.options.data = Component.options.data Component._Ctor.options.data = Component.options.data
@ -169,11 +170,13 @@ function fixPrepatch (to, ___) {
} }
return instance.constructor.options.__file return instance.constructor.options.__file
}) })
hotReloadAPI(this)
}) })
} }
// Special hot reload with data(context) // Special hot reload with data(context)
function hotReloadAPI (_app) { function hotReloadAPI (_app) {
if (!module.hot) return
const $nuxt = _app.$nuxt const $nuxt = _app.$nuxt
var _forceUpdate = $nuxt.$forceUpdate.bind($nuxt) var _forceUpdate = $nuxt.$forceUpdate.bind($nuxt)
$nuxt.$forceUpdate = function () { $nuxt.$forceUpdate = function () {
@ -185,7 +188,14 @@ function hotReloadAPI (_app) {
Component._Ctor = Component Component._Ctor = Component
} }
let promises = [] let promises = []
promises.push(_app.setLayout(Component.options.layout)) // If layout changed
if (_app.layoutName !== Component.options.layout) {
let promise = _app.setLayout(Component.options.layout)
promise.then(() => {
hotReloadAPI(_app)
})
promises.push(promise)
}
const next = function (path) { const next = function (path) {
<%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %> <%= (loading ? 'this.$loading.finish && this.$loading.finish()' : '') %>
router.push(path) router.push(path)
@ -198,12 +208,16 @@ function hotReloadAPI (_app) {
Component._data = Component._Ctor.options.data || noopData Component._data = Component._Ctor.options.data || noopData
let p = promisify(Component._data, context) let p = promisify(Component._data, context)
p.then((data) => { p.then((data) => {
Component.options.data = () => data || {} Component._cData = () => data || {}
Component.options.data = Component._cData
Component._dataFn = Component.options.data.toString().replace(/\s/g, '') Component._dataFn = Component.options.data.toString().replace(/\s/g, '')
Component._Ctor.options.data = Component.options.data Component._Ctor.options.data = Component.options.data
<%= (loading ? 'this.$loading.increase && this.$loading.increase(30)' : '') %> <%= (loading ? 'this.$loading.increase && this.$loading.increase(30)' : '') %>
}) })
promises.push(p) promises.push(p)
} else if (Component._cData) {
Component.options.data = Component._cData
Component._Ctor.options.data = Component.options.data
} }
// Check if fetch has been updated // Check if fetch has been updated
const originalFetchFn = (Component.options.fetch || noopFetch).toString().replace(/\s/g, '') const originalFetchFn = (Component.options.fetch || noopFetch).toString().replace(/\s/g, '')
@ -246,7 +260,8 @@ const resolveComponents = flatMapComponents(router.match(path), (Component, _, m
if (Component.options.data && typeof Component.options.data === 'function') { if (Component.options.data && typeof Component.options.data === 'function') {
Component._data = Component.options.data Component._data = Component.options.data
if (NUXT.serverRendered) { if (NUXT.serverRendered) {
Component.options.data = () => NUXT.data[index] || {} Component._cData = () => NUXT.data[index] || {}
Component.options.data = Component._cData
Component._dataFn = Component.options.data.toString().replace(/\s/g, '') Component._dataFn = Component.options.data.toString().replace(/\s/g, '')
} }
if (Component._Ctor && Component._Ctor.options) { if (Component._Ctor && Component._Ctor.options) {
@ -291,7 +306,7 @@ Promise.all(resolveComponents)
_app.$loading = _app.$nuxt.$loading _app.$loading = _app.$nuxt.$loading
<% } %> <% } %>
// Hot reloading // Hot reloading
if (module.hot) hotReloadAPI(_app) hotReloadAPI(_app)
// Call window.onNuxtReady callbacks // Call window.onNuxtReady callbacks
Vue.nextTick(() => nuxtReady(_app)) Vue.nextTick(() => nuxtReady(_app))
} }