uniapp常用标签

一.uni-app常用标签

该组件类似HTML中的<a>组件，但只能跳转本地页面。目标页面必须在pages.json中注册
二. 标签用法
1.view
类似于HTML中的div标签通常用于布局和包裹其他标签

2.scroll-view
在指定的区域设置一块可以左右滚动的区域,通常用于下拉刷新和商品主体部分

代码示例
<template>
    <scroll-view class="scrollview" scroll-y="true">
        <view class="box">0</view>
        <view class="box">1</view>
        <view class="box">2</view>
        <view class="box">3</view>
        <view class="box">4</view>
        <view class="box">5</view>
        <view class="box">6</view>
        <view class="box">7</view>
        <view class="box">8</view>
        <view class="box">9</view>
    </scroll-view>
</template>
 
<script>
 
</script>
 
<style>
    .scrollview {
        height: 100px;
        border: 1px solid red;
        white-space: nowrap;
    }
 
    .box {
        widows: 100px;
        height: 100px;
        background-color: aqua;
 
    }
</style>

3.swiper
用于制作轮播图

代码示例
<template>
<swiper class="swiper" indicator-dots autoplay interval="1000">
    <swiper-item class="swiperview">111</swiper-item>
    <swiper-item class="swiperview">222</swiper-item>
    <swiper-item class="swiperview">333</swiper-item>
    <swiper-item class="swiperview">444</swiper-item>
    </swiper>
</template>
 
<script>
 
</script>
 
<style>
    .swiper {
        height: 100px;
        border: 1px solid red;
        white-space: nowrap;
    }
 
    .swiperview {
        widows: 100px;
        height: 100px;
        background-color: aqua;
 
    }
</style>

4.image
相对于HMTL中的img,用于展示图片

代码示例
<template>
    <scroll-view class="scrollview" scroll-y="true">
        <image src="../../static/1.jpeg" class="imger"></image>
        <image src="../../static/2.jpeg" class="imger"></image>
        <image src="../../static/3.png" class="imger"></image>
        <image src="../../static/4.jpg" class="imger"></image>
        <image src="../../static/5.png" class="imger"></image>
    </scroll-view>
</template>
 
<script>
 
</script>
 
<style>
    .scrollview {
        height: 280px;
        border: 1px solid red;
    }
</style>

5.text

6.navigator


7.button