1.npm install swiper@3.4.1-- save-dev installs the swiper dependency package
2.import Swiper from "swiper"; references dependencies on the page, and the
node has loaded images, but the page does not display
dom
created
page display is blank, there is no broadcast picture
did you put it in the background picture?
1. It is possible that your div does not have a height, so it cannot be displayed
2. Check the image address
try the new version of swiper, swiper 4;
vue introduces a new version of swiper to fill the hole
if you use swiper in Vue, it is recommended to use vue-swiper , which should perfectly solve the landlord problem.
vue-awesome-swiper, encapsulates swiper,.
vue-awesome-swiper, can be used in vue, but the swiper-pagination is empty and there is no paging effect. < div data-v-5818899c= " " class= "swiper-pagination " > < div > < swiper: options= "swiperOption " ref= "mySwiper " > <!-- slides --...
when you use vue-awesome-swiper to make a rotation picture on the mobile end to get a picture from to the background, when the last picture is switched to the second picture instead of the first , Baidu has a way to initialize swiper after getting data...
use the swiper plug-in to put js into stat and quote the Times incorrectly. I made this mistake after I installed it with npm. Excuse me, what s going on? The mistake of Zongbao error as shown in the figure! ...
Vue has a Unknown custom element: < swiper > problem after using Swiper error code icon the program code goes like this: main.js import Vue from vue import App from . App import router from . router import axios from axios i...
attach code: swiperOption: { notNextTick: true, autoplay: false, direction: horizontal , setWrapperSize: true, autoHeight: true, centeredSlides: true, paginationClickable: true, navigation: { nextEl: .s...
how to use swiper to implement cascading and rowing of the following image. After the picture, two pictures of different sizes are leaked. ...
THANKS FOR YOUR time! parent component <!--tab swiper--> <li class="tab-item" v-for="(item,index) in processItems" @click="tabProcess(index)" :class="{active: processTabActiveIndex === index}"> ...
use vue to render a large amount of data (picture and text list) + swiper + 10 + tab to the end, the more data, the more memory it takes up to 100m, how to optimize it to dozens of m ...
when you set loop to true, when you cycle back to the first picture for the second time, the data is gone . ...
the vue project uses "vue-awesome-swiper ": "^ 2.5.4 " to realize the rotation error report. steps are as follows: 1, install 2, introduce component reference import { swiper, swiperSlide } from vue-awesome-swiper export default { ...
description: : vue-awesome-swiper : import swiper dist css swiper.css import { swiper, swiperSlide } from vue-awesome-swiper components swiperswiperSlide template; everything is fine; however: found that the introd...
< div style= "height:2.944rem; " > <div class="banner-box" v-if="swiperLists[0]"> <swiper :options="swiperOption" :not-next-tick="notNextTick" > <swiper-slide class=&...
For a mobile page such as , when loading for the first time, if manual carousel is triggered, it will be stuck. Automatic carousel is easy to use, but once manual carousel is also stuck, it cannot be automatically rotated. but exit the page and enter ...
the first page is 1 2 3 4 4 lists the second page is swiper page, which corresponds to four pages in the first page. After clicking 3 on the first page, the index value is brought to the second page , and then after the second page is received, it jum...
vue uses Swiper for carousel, but exit the component and enter the component Picture and pager do not Synchronize , and manually slide the picture , but the pager does not move ; similar to the following illustration. this.$nextTick(()...