如何解决Nuxt js超出最大调用堆栈大小
祝您有美好的一天!刚开始研究Nuxtjs和Vue时遇到了这样的问题,最初加载页面时,所有内容均正常显示,但是一旦我重新启动,就会出现最大堆栈大小超出错误。我意识到问题是由于asyncData
函数引起的,但是我正在做的事情理解不正确。请告诉我我错了。
<template>
<section>
<h1>USERS</h1>
<ul>
<li v-for="user of getusers.data" :key="user.id" >
<a href="#" @click.prevent="openUser(user.id)">{{ user.name }}</a>
</li>
</ul>
</section>
</template>
<script>
export default {
async asyncData ({$axios}) {
const getusers = await $axios.get('http://jsonplaceholder.typicode.com/users')
return {getusers}
},data: () => ({
getusers: []
}),methods: {
openUser(user) {
this.$router.push('/users/' + user
)
}
}
}
</script>
解决方法
解决方案很简单。忘记获取$符号,然后修改周期。
const getusers = await $axios.$get('http://jsonplaceholder.typicode.com/users')
v-for =“ getusers的用户”
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。