Da es sich um eine Kommunikation zwischen Vater und Sohn handelt, habe ich das Online-Tutorial befolgt, um eine bus.js-Datei zu erstellen
Vue aus „vue“ importieren
Standardneues Vue() exportieren
Die erste Komponente login.vue wird für $emit verwendet
this.usermsg ist ein Objekt
bus.$emit('usermessage', this.usermsg)
this.$router.push({name: 'mine'})
Die erste Komponente „mine.vue“ wird zum $emit
data() {
return {
userData: {},
}
},
created() {
bus.$on('usermessage', (usermsg) => {
console.log(this.msg)
console.log(usermsg.name)
this.userData= usermsg
console.log('mine接收到的usermsg')
console.log(this.userData)
})
mounted() {
console.log(this.userData)
}
Die Daten von userData werden nicht geändert und die Zuweisung wird nicht wirksam. Weist das auf die falsche hin? Oder sollte ich die Zuordnung nicht so ändern? Ich habe viele Methoden ausprobiert und bin verwirrt
首先,你的mine.vue必须先初始化了,在$on('usermessage')后,相关代码触发$emit('usermessage'),才会接收到这个事件。按照你现在的代码,你在emit的时候,mine.vue根本就还没初始化,所以是监听不到这个事件的。
然后,你的this指向没错,因为你用了箭头函数,详情可以看下箭头函数的this指向问题。(虽然不知道你this.msg是想干啥,明明data里面没有msg)
另外你的思路是登录获取到用户信息后展示在mine.vue页面吧,建议你用vuex保存用户信息,这样就可以在其他页面拿到了
楼上正解;
跳转到login的时候,mine这个组件会销毁了,你可以在destroyed那个生命周期打印点东西看看是不是。这样当你再次跳转到mine时,里面的内容就是重新初始化一遍的了,这样你打印出来的东西永远是刚初始化还没操作过的内容。