To make our app work, we will ask random words from the http://www.setgetgo.com/randomword/get.php endpoint. Every time you point the browser at this address, you will get a random word.
The whole page will consist solely of an infinite list of words. Write the following HTML:
<div id="app"> <p v-for="word in words">{{word}}</p> </div>
The list of words needs to grow as we scroll down. So we need two things: understanding when the user reaches the bottom of the page, and getting new words.
To know when the user has reached the bottom of the page, we add a method in our Vue instance:
new Vue({ el: '#app', methods: { bottomVisible () { const visibleHeight = document.documentElement.clientHeight const pageHeight = document.documentElement.scrollHeight ...