I developing web app in Nuxt.js (Vue.js)
first, vue init nuxt/express MyProject
~page/help.vue
<template>
<div>
<p v-for="item in list">
Line:
<span v-text="item"></span>
</p>
<infinite-loading :on-infinite="onInfinite" spinner="bubbles" ref="infiniteLoading"></infinite-loading>
</div>
</template>
<script>
let InfiniteLoading = require('vue-infinite-loading')
export default {
...
components: {
InfiniteLoading
},
methods: {
onInfinite: function () {
setTimeout(() => {
const temp = []
for (let i = this.list.length + 1; i <= this.list.length + 20; i++) {
temp.push(i)
}
this.list = this.list.concat(temp)
this.$refs.infiniteLoading.$emit('$InfiniteLoading:loaded')
}, 1000)
}
}
}
</script>
and, Moving from '/home' to '/help'
window is not defined
So, I tried the following
let InfiniteLoading;
if (process.BROWSER_BUILD) {
InfiniteLoading = require('vue-infinite-loading')
}
result,
Failed to mount component: template or render function not defined.(found in InfiniteLoading)
I've tried the nuxt.js document method. However, I could not solve it. I want to find a more accurate answer.
help me, Thanks.
via J. thomas
No comments:
Post a Comment