我目前情况,父组件在ready中通过Ajax得到总的外部数据,然后通过$broadcast,让当前路由里的子组件,成功收到数据。但是路由一变,数据就没有了。这种模式,如何让每个子组件都得到数据?
我也想过router.afterEach时再次$broadcast,但不知如何写代码,也不知道这样做是否合理?
用的是vue1.0.28版本,没用2.0版本。
父组件app.js
var App = Vue.extend({
components: { nav_main,foot,modal },
data() {
return {
mydata:{}
}
},
methods: {
send_data: function() {
var self = this;
$.ajax({
url: './data/main.json'
})
.done(function(data) {
self.mydata = data;
self.$broadcast("done", self.mydata);
})
}
},
ready () {
this.send_data;
}
});
Vue.use(VueRouter);
var router = new VueRouter();
router.map({
'/sc_cover': {component: sc_cover,tit:"封面页" },
'/sc_yfh': {component: sc_yfh,tit:"云峰湖" },
'/sc_holiday': {component: sc_holiday,tit:"住假" },
'/sc_expe':{component: sc_expe,tit:"体验"}
})
router.afterEach(
function (arg) {
document.title= arg.to.tit;
}
);
router.start(App, '#app');
router.go({"path":"/sc_holiday"});
子组件sc_yfh.vue接收$broadcast传来的数据:
events: {
"done": function(data) {
this.mydata = data;
}
}