09-17小程序的组件

2023-09-19  本文已影响0人  逢笔生辉

组件

小程序提供了丰富的基础组件给开发者,开发者可以像搭积木一样,组合各种组件拼合成自己的小程序。

视图容器

基础内容

表单组件

导航组件

媒体组件

map地图组件

cavans组件

常用的容器组件

1 view

类似div块级

2scroll-view 

可滚动的列表

3  swiper和swiper-item

轮播图容器组件和轮播图item组件

view组件的基本使用

用flex横向布局

<text>pages/list/list.wxml</text>

<view class="congtainer">

  <view>a</view>

  <view>b</view>

  <view>c</view>

</view>

这是wxml中内容

我在加了wxss后

帮其加上了颜色,后面要实现横向布局

加上这

代码中flex是用作横向。而justify-content是用作分散分布的

现在使用scroll-view组件来基本使用

还有要加一个强制性的高度

可以看到有个红色边框线,是包括在里面

还要有强制宽度,高度,是可这个a,b,c的容器的大小相同

用swiper和swiper-item组件的基本使用

代码构成

<swiper class="swiper-container">

    <!--第一个轮播图-->

    <swiper-item>

其中的swiper中这个swiper-item要放在其下面,只有在swiper-item中组件才能正常工作

wxss中代码

这里的a,b,c就行

在最外面一定要放一个容器swiper

indicator 控制下面的小圆点

indicator-dots激活小圆点。指定小圆点的颜色。indicator-active-color转到哪个的颜色 autoplay是否自动切换,自动切换能够设置时间

circular能够衔接切换。例如从a-b-c-a

上一篇下一篇

猜你喜欢

热点阅读