Briefly
When using swiper in vue3 recently, I suddenly found that when the loop attribute and the slides-per-view attribute are enabled at the same time, the loop takes effect, and the next step can only take effect once, but the previous step is good. Very strange.
resolution process
- Analyze attributes for usage errors.
loop is the loop mode, Boolean.
slides-per-view is how many numbers are displayed on the same screen, numeric or 'auto'. - Whether the changed style is the cause.
no. - Look at the official website, Baidu.
Baidu can't find similar bugs, see the official website. It is found that the loop attribute description has a limited description.
- Finally look for an alternative, or lower demand.
Not so far.
problem causes
There is such a sentence in the description of the loop attribute on the official website.
Because of nature of how the loop mode works (it will rearrange
slides), total number of slides must be >= slidesPerView * 2
It means that your data should be greater than or equal to twice the number displayed on one screen
solution
- Get more data.
- The slides-per-view attribute value is reduced.