uni-app 基础控件

对于较为基础的内容，分为显示用途的内容和交互用途的内容。

显示类组件

• <text>：文本显示
• <icon>：图标显示
• <rich-text>：富文本显示
• <progress>：进度条
• <canvas>：画布
• <web-view>：嵌入网页

交互类组件

表单

• <button>：按钮
• <checkbox>：复选框
• <form>：表单
• <input>：输入框
• <label>：标签
• <picker>：选择器
  • 普通选择器
  • 多列选择器
  • 时间选择器
  • 日期选择器
  • 省市区选择器
• <picker-view>：滚动选择器
  • 要搭配上 <picker-view-column> 使用
• <radio>：单选框
• <slider>：滑块
• <switch>：开关
• <textarea>：多行输入框

页面跳转

• <navigator>：页面链接

checkbox

• <checkbox-group>：复选框组
• <checkbox>：复选框

1
2
3
4
5
6
7
8
9

<template>
    <view>
        <checkbox-group @change="checkboxChange">
            <label v-for="(item, index) in checkboxItems" :key="index">
                <checkbox :value="item.value" :checked="item.checked">{{ item.name }}</checkbox>
            </label>
        </checkbox-group>
    </view>
</template>

参考资料

1. 组件使用的入门教程 | uni-app 官网