Помогите, пожалуйста, разобраться.
У меня есть экземпляр, который принимает контент страницы и раскидывает данные по компонентам, когда юзер скроллит до секции, в котором должен находиться контент.
Запрос к контенту зависит от того, с какого именно слайда начал скроллить юзер. (Т.е - открывается слайдер с 5ю слайдами, если юзер скроллит от 1го слайда - запрашивается один json, если со 2го - другой итд).
В data экземпляра при его инициализации реквайрится js-модуль, в котором находятся все изначальные состояния данных. Если юзер скроллит обратно к слайдеру, то мне нужно очистить контент на его изначальное состояние, но вот проблема - модуль с объектом изначального состояния с какого-то перепуга мутирует в последний загруженный контент, абсолютно наплевав на то, что я использую Object.assign во избежание этой проблемы.
if vContentEl
currentRoute = vContentEl.getAttribute("data-page")
# тут я из модуля начальной структуры контента создаю новый объект !!НОВЫЙ!!
# и отдаю его на съедение rootContent.$data - всё проходит правильно, но proxy начинает обсервиться
console.log(require './content/proxy') #уже мутировал и обсервится
contentProxy = Object.assign(require "./content/proxy")
rootContent = new Vue
el: "#vcontent"
data: ->
return contentProxy
components:
vcontent: require("./content/content.vue")
lightbased: require("./content/components/lightbased.vue")
blogbar: require("./content/components/blogbar.vue")
team: require("./content/components/team.vue")
partners: require("./content/components/partners.vue")
features: require("./content/components/features.vue")
condits: require("./content/components/condits.vue")
getPageData = ->
that = this
switch currentRoute
when "about"
axios.get('/jsondata/about/data.json')
.then (resp) ->
Object.assign rootContent.$data.data, resp.data.data
.catch (err) ->
console.log err
when "skyfall"
axios.get('/jsondata/skyfall/data.json')
.then (resp) ->
Object.assign rootContent.$data.data, resp.data.data
.catch (err) ->
console.log err
else
return
isInited = false
window.addEventListener 'scroll', (e) ->
if window.pageYOffset >= 200 && isInited == false
console.log('set data')
getPageData()
isInited = true
return
if window.pageYOffset < 200 && isInited == true
Object.assign rootContent.$data, require("./content/proxy").data
isInited = false
UPD: Ребят, если кому интересно - только что решил проблему:
на 3м часу неистовых попыток привести Vue в чувство я просто взял и превратил модуль ./content/proxy в функцию, которая возвращала мне data с начальным состоянием
vContentEl = document.querySelector "#vcontent"
if vContentEl
proxy = require("./content/proxy")
rootContent = new Vue
el: "#vcontent"
data: proxy()
components:
vcontent: require("./content/content.vue")
lightbased: require("./content/components/lightbased.vue")
blogbar: require("./content/components/blogbar.vue")
team: require("./content/components/team.vue")
partners: require("./content/components/partners.vue")
features: require("./content/components/features.vue")
condits: require("./content/components/condits.vue")
getPageData = (currentRoute)->
console.log currentRoute
switch currentRoute
when "about"
axios.get('/jsondata/about/data.json')
.then (resp) ->
Object.assign rootContent.$data.data, resp.data.data
.catch (err) ->
console.log err
when "skyfall"
axios.get('/jsondata/skyfall/data.json')
.then (resp) ->
Object.assign rootContent.$data.data, resp.data.data
.catch (err) ->
console.log err
else
return
isInited = false
window.addEventListener 'scroll', (e) ->
if window.pageYOffset >= 200 && isInited == false
vContentEl = document.querySelector "#vcontent"
getPageData(vContentEl.getAttribute("data-page"))
isInited = true
return
if window.pageYOffset < 200 && isInited == true
contentProxy = proxy()
Object.assign rootContent.$data, contentProxy
isInited = false