面板(panel)

介绍

面板只是一个容器，里面可以放入自定义的内容。

#引入

在app.json或index.json中引入组件，详细介绍见快速上手

"usingComponents": {
  "mx-panel": "/miniprogram_npm/m-ui/mx-panel/index",
}

#小程序码

可使用微信扫码查看小程序码

#

#代码演示

#基本用法

 <mx-panel padding="16" margin height="107">span: 24</mx-panel>

#修改背景色

 <mx-panel padding="16" bgColor="#267AFF" margin custom-class="panel-color" height="107">span: 24</mx-panel>

#无圆角

  <mx-panel padding="16" border="{{false}}" bgColor="#E61E1E" margin custom-class="panel-color" height="107">span: 24</mx-panel>

#无内外边距

 <mx-panel height="107">span: 24</mx-panel>

#API

#Props

参数	说明	类型	默认值
margin	是否需要外边距	boolean	false
paading	左右内边距	string	16
border	是否需要边框	boolean	true
bgColor	背景色	string	#fff
height	自定义高度	string	-
width	自定义宽度	string	-
hoverClass	是否需要按压样式	Boolean	false

#Slot

名称	说明
-	默认插槽，用于在组件嵌入内容

#外部样式类

名称	说明
custom-class	根节点样式类