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

PropsDescriptionTypeDefaultNote
titletitleString/Number--
briefdescription textString/Number--
addonhelp info textString--
disableddisable item operationBooleanfalse-
arrowarrow indicatorBooleanfalse-
no-borderremove borderBooleanfalse-

CellItem Events

@click(event)

click event when not disabled

CellItem Slots

default

default content slot

left

left content slot

right content slot

children

extra children slot