uview-plus

# Box 盒子

box盒子一般为左边一个盒子，右侧两个等高的半盒组成，常用于App首页座位重点突出。

# 平台差异说明

App（vue） App（nvue） H5 小程序
√ √ √ √

# 基本使用

  • 通过bgColors(设置3个盒子的背景色)，height(盒子总高度)，gap(盒子间隔)
  • 通过borderRadius设置盒子圆角大小
<template>
	<view class="p-4 bg-white">
        <up-box height="160px" gap="12px" :bgColors="['#EEFCFF', '#FCF8FF', '#FDF8F2']">
            <template #left>
                左
            </template>
            <template #rightTop>
                右上
            </template>
            <template #rightBottom>
                右下
            </template>
        </up-box>
    </view>
</template>

# 右侧演示页面源代码地址

点击以下链接以查看右侧演示页面的源码


 github  gitee

# API

# Props

参数 说明 类型 默认值 可选值
height 高度 String 160px
bgCorlors 盒子背景色 String ['#EEFCFF', '#FCF8FF', '#FDF8F2']
borderRadius 圆角 String 6px
gap 间隔 String 15px

# Slot

名称 说明
left 左侧
rightTop 右上
rightBottom 右下

← Divider 分割线 →