the browser reported an error after the route returned to the previous level.
routing relationship: dialogues.vue= > chatview.vue
chatview section:
<template>
<div id="chatview">
<div id="back" @click="back">
<span> </span><span></span>
</div>
<div id="title">{{chat.name}}</div>
</div>
</template>
<script type="text/javascript">
export default{
methods:{
back(){
this.$router.go(-1)
}
},
computed: {
chat() {
return this.$route.query.chatid;
}
}
}
</script>
dialogues section:
<template>
<div id="dialogue">
<div id="chatcontent" v-for="thedialoge in dialogues">
<router-link :to="{path:"/chatview",query:{chatid:thedialoge}}">
<div id="chatcontainer">
xxxx
</div>
</router-link>
</div>
</div>
</template>
<script type="text/javascript">
import axios from "axios"
export default{
data() {
return {
dialogues:[],
}
},
created() {
axios.get("static/data.json").then(response =>
(this.dialogues=response.data.dialogue)
)
},
}
</script>
after clicking the back button from chatview to return to the previous route, the browser reported an error:
[Vue warn]: Error in render: "TypeError: Cannot read property "name" of undefined"
found in
---> <Chatview> at src\components\pages\chatview.vue
TypeError: Cannot read property "name" of undefined
chat.name can be rendered successfully when entering from dialogues.vue to chatview.vue. When returning from chatview.vue to this.$router.go (- 1) to dialogues.vue, there will be an error [Vue warn]: Error in render: "TypeError: Cannot read property "name" of undefined"
. Is there something wrong?