Luminous te lleva al campo del desarrollo de pequeños programas WeChat (11)

Prólogo luminoso:

 

 

Verás, las nubes no están dispersas, el viento está flotando, esa es mi confesión más corta.

 

 

 

 

 
 
Texto:
 
                                              Reconocer el Tao con el Tao

 

 

<!--pages/milk/milk.wxml-->
<text>精彩呈现</text>
<!--  首先 需要一个容器 夜光 -->
<view class="container2">
  <!-- 学过前端都知道，这种一直变换的图片组件~~ 在微信小程序开发里面稍微轻松点-->
  <swiper>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/a.png"></image>
    </swiper-item>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/b.jpg"></image>
    </swiper-item>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/d.jpg"></image>
    </swiper-item>
        <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/c.png"></image>
    </swiper-item>
  </swiper>
</view>

 

¿Por qué es vertical?

Debido a que se necesitan algunas otras cosas a continuación, como el círculo pequeño del componente de carrusel y el menú y similares

/* 样式很重要，在这里书写 */
.container2{
   display: flex;
   flex-direction: column;
   width: 100%;
   padding: 0 20rpx;
}

.container2 swiper{
   width: 100%;
}

swiper swiper-item{
   width: 100%;
}

image{
   width: 100%;
}

 

<! - Tenga en cuenta los siguientes dos atributos

1. reproducción automática

2. Reproducción circular

->

<!--pages/milk/milk.wxml-->
<!-- <text>精彩呈现</text> -->
<!--  首先 需要一个容器 夜光 -->
<view class="container2">
  <!-- 学过前端都知道，这种一直变换的图片组件~~ 在微信小程序开发里面稍微轻松点-->
  <swiper autoplay="true" circular>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/a.png" mode="widthFix"></image>
    </swiper-item>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/b.jpg" mode="widthFix"></image>
    </swiper-item>
    <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/d.jpg" mode="widthFix"></image>
    </swiper-item>
        <swiper-item>
    <!-- 轮播，一般，我们都是放图片 -->
     <image src="/images/temp/c.png" mode="widthFix"></image>
    </swiper-item>
  </swiper>
</view>

 

Años de experiencia en desarrollo, pase lo que pase

Es importante leer la API y el manual.

Porque esta es la enciclopedia más completa