CellItem
Arrange vertically and display current contents, status and other allowable operations.
Import
import { CellItem } from 'mand-mobile-next'
Vue.createApp().component(CellItem.name, CellItem)
Code Examples
基本
普通条目
动作条目
禁用条目
插槽
余额
可用8000.34
余额
可用8000.34
使用余额
使用余额
余额
可用8000.34
多行列表
交通银行(尾号3089)
展示摘要描述
招商银行(尾号2342)
展示摘要描述
交通银行(尾号3089)
展示摘要描述
附加文案
交通银行
展示摘要描述
附加文案
招商银行
展示摘要描述
禁用的项目
Mand Mobile
A mobile UI toolkit
面向金融场景的Vue移动端UI组件库,丰富、灵活、实用,快速搭建优质的金融类产品,让复杂的金融场景变简单。基于「合理、好用」设计价值观,从交互操作、视觉抽象、图形可视等角度共同解决问题。
基础
CellItem
列表单元
基本
普通条目
动作条目
禁用条目
插槽
余额
可用8000.34
余额
可用8000.34
使用余额
使用余额
余额
可用8000.34
多行列表
交通银行(尾号3089)
展示摘要描述
招商银行(尾号2342)
展示摘要描述
交通银行(尾号3089)
展示摘要描述
附加文案
交通银行
展示摘要描述
附加文案
招商银行
展示摘要描述
禁用的项目
Mand Mobile
A mobile UI toolkit
面向金融场景的Vue移动端UI组件库,丰富、灵活、实用,快速搭建优质的金融类产品,让复杂的金融场景变简单。基于「合理、好用」设计价值观,从交互操作、视觉抽象、图形可视等角度共同解决问题。
API
CellItem Props
Props | Description | Type | Default | Note |
---|---|---|---|---|
title | title | String/Number | - | - |
brief | description text | String/Number | - | - |
addon | help info text | String | - | - |
disabled | disable item operation | Boolean | false | - |
arrow | arrow indicator | Boolean | false | - |
no-border | remove border | Boolean | false | - |
CellItem Events
@click(event)
click event when not disabled
CellItem Slots
default
default content slot
left
left content slot
right
right content slot
children
extra children slot