我的一些数据有问题。 当我加载我的仪表板时,它给我一个错误,它无法读取未定义的数量。 当我重新加载页面时,它可以工作。 所以这是我登录数据不起作用的地方。 但在重新加载时它应该如何工作。
我已经尝试在两个组件的图表之前使用 v-if 并尝试定义一个对象并将其填充到图表组件上。然后说 v-if。没有任何作用。谁能帮忙?
我有3个组件
- 登录(组件在成功登录时推送到仪表板)
- 仪表板(带有导入图表的组件)
- 图表(这里是生成的图表)
登录:我在这里登录并将路由推送到仪表板
<template>
<button @onclick="login()"> Login </button>
</template>
<script>
heres the login functions that initialize the session i fill with
user data.
</script>
仪表板:我在这里用我想要的数据填充 session 。
<template>
<p v-if="company.thirtydayScore"> {{company.thirtydaysscore}} </p>
<chart> </chart>
</template>
<script>
data(){
company{
thirtydaysScore: null
amount: null and so on
}
},
async beforeMount () {
await this.fetchData()
await this.$eventHub.$emit('runToday')
}
methods: {
fetchData(){
heres api call and fetching of data
this.company = response.data
this.$session.set('data', this.company)
}
}
</script>
图表
<template> <myChart> </myChart> </template> <script> data(){ company{ thirtydaysScore: null amount: null and so on } }, async beforeMount () { var self = this await this.$eventHub.on('runToday'){ self.fillData() } } methods: { fillData(){ here do i fill the data i use in charts from this.$session.get('data') } } </script>
错误图片
登录 hastebin:https://hastebin.com/imeqaxevim.xml
仪表板 hastebin:https://hastebin.com/ixuyiroyuy.xml
图表 hastebin:https://hastebin.com/iheqiditiy.xml
最佳答案
我不确定我的问题是否完全一样,但是我用vee-validate遇到过很多次这个错误。似乎启动数据和组件之间不匹配。可能会有更好的解决方案,但我总是非常务实地使用 v-if = "company && company.amount"
来解决这些错误。
关于javascript - Vue 取数据前的未定义数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52180679/