BhtContentThree
文档版本:1.0.0
描述
菜单内容组件,用于展示第三种内容列表布局。
效果
![]()
示例
<bht-content-three></bht-content-three>
代码
<bht-content-three :ref="item.id" :item="item"></bht-content-three>
或者
<BhtContentThree :ref="item.id" :item="item"></BhtContentThree>
参数
| 参数 | 类型 | 必填 | 默认值 | 说明 |
|---|---|---|---|---|
| item | Object | 否 | - | 组件配置信息。 |
配置项
item.config.data 支持的常用字段如下:
| key | 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|---|
| noContentShow | 没有内容显示 | string | true | 请输入是否 没有内容显示 |
| titleStyle | 标题样式 | string | font-size: 20px; | 请输入 标题样式 |
| imgStyle | 图片样式 | string | width: 360px; height: 260px; | 请输入 图片样式 |
| contentStyle | 内容样式 | string | line-height: 35px; | 请输入 内容样式 |
| name | 菜单名称 | query | - | 请输入菜单名称 |
| groupName | 分组名称 | query | - | 请输入分组名称 |
| title | 内容标题 | query | - | 请输入内容标题 |
| menuPage.current | 菜单页码 | query | 1 | 请输入 菜单页码 |
| menuPage.size | 菜单条数 | query | 10 | 请输入的菜单条数 |
| contentPage.current | 内容页码 | query | 1 | 请输入 内容页码 |
| contentPage.size | 内容条数 | query | 10 | 请输入的内容条数 |
| orderByColumn | 排序字段 | query | createDatetime | 请输入排序字段 |
| isAsc | 排序方式 | query | desc | 请输入排序方式(可选值:desc、asc |
引入
import { BhtContentThree } from '@behappyto/cms-ui-vue3'