How to render dom again with vue?

1. If there are 600 items of data

2. In dom, we use v-for to render the first 200 items, such as "$index < num" or other ways; let"s declare num:200

3. Here we want to use an event to trigger, such as click,scroll, to render the rest of the data.

how about it? is there any coquettish operation?

Mar.28,2021

I think providing pageNum and pageSize fields in the interface is the most convenient
whether it is displayed by page or loading more, you can do


those ui (iview and element ui) all have the functions of paging and sliding loading!

if I have to do it myself, I think I can split 600 pieces of data. data1 , data2 , data3 ,.

< H2 > 200 per mile. Just cycle data1 , slide to the end and cycle data2 ( append , here append depends on whether you want to keep the data in data1 ),. < / H2 >.

for reference only


vMuIf = "$index < num"

I wish

num was a variable

click changes the value of num


better-scroll
https://github.com/ustbhuangy.


vue can listen for changes in data,

first, the requested data is stored in A, and then we live a B to store the first 200 entries of A. at this time, the first 200 entries are rendered, and then the event is triggered to make B 201-

.

400 items (can be added up, depending on your needs)

then the data changes will be re-rendered, of course, the number of the above can be variables

this makes it easy to implement

of course, it is better that the interface can be paged

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1bead5f-31a4e.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1bead5f-31a4e.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?