1.0.37 • Published 3 years ago

zyd-client-framework v1.0.37

Weekly downloads
-
License
MIT
Repository
-
Last release
3 years ago

zyd-client-framework

Installation

$ npm install -s zyd-client-framework

Import

import { List, ListGroup, LeftSlider, Block, BlockGroup } from 'zyd-client-framework'

List

property

nameexplaintypedefaultexamples
title标题Stringtitle="标题"
desc副标题Stringdesc="副标题"
foot右侧副标题Stringfoot="145"
isLink是否显示右侧剪头Booleanfalse:isLink="false"
fun点击事件调用的方法Function:fun="getItem"
icon图标对象,同elementUI Plus的icon使用方法Object:icon="plus"
showBorder是否显示行间边框Booleantrue:showBorder="false"
disabled是否禁用Booleanfalse:disabled="true"
iconClass图标css类名StringiconClass="iconClass"
titleClass标题css类名StringtitleClass="titleClass"
descClass副标题css类名StringdescClass="descClass"
footClass右侧副标题css类名StringfootClass="footClass"
itemClassList元素css类名StringitemClass="itemClass"
maskClass禁用遮罩层css类名StringmaskClass="maskClass"

examples

<List
  title="title"
  desc="desc"
  foot="foot"
  :isLink="true"
  :fun="()=>{}"
  :icon="IceCreamRound"
  :showBorder="true"
  :disabled="true"
  iconClass="iconClass"
  titleClass="titleClass"
  descClass="descClass"
  footClass="footClass"
  itemClass="itemClass"
  maskClass="maskClass"
></List>

Slot

nameexplain
icon图标插槽
title标题插槽
desc副标题插槽
foot右侧副标题插槽

examples

<List>
  <template #icon>
    <component class="listIcon" :is="icon" />
  </template>
  <template #title>title</template>
  <template #desc>desc</template>
  <template #foot>foot</template>
</List>

ListGroup

property

nameexplaintypedefaultexamples
title标题Stringtitle="标题"
disabled是否禁用Booleanfalse:disabled="true"
titleClass标题css类名StringtitleClass="titleClass"
maskClass禁用遮罩层css类名StringmaskClass="maskClass"

examples

<ListGroup 
  :disabled="true" 
  maskClass="maskClass" 
  itemClass="itemClass" 
  title="title"
>
  <List />
</ListGroup>

Block

property

nameexplaintypedefaultexamples
title标题Stringtitle="标题"
desc副标题Stringdesc="副标题"
foot右侧副标题Stringfoot="145"
fun点击事件调用的方法Function:fun="getItem"
icon图标对象,同elementUI Plus的icon使用方法Object:icon="plus"
showBorder是否显示行间边框Booleantrue:showBorder="false"
disabled是否禁用Booleanfalse:disabled="true"
iconClass图标css类名StringiconClass="iconClass"
titleClass标题css类名StringtitleClass="titleClass"
descClass副标题css类名StringdescClass="descClass"
footClass右侧副标题css类名StringfootClass="footClass"
itemClassList元素css类名StringitemClass="itemClass"
maskClass禁用遮罩层css类名StringmaskClass="maskClass"

examples

<Block
  title="title"
  desc="desc"
  foot="foot"
  :icon="IceCreamRound"
  :showBorder="true"
  :fun="()=>{}"
  :disabled="true"
  iconClass="iconClass"
  titleClass="titleClass"
  descClass="descClass"
  footClass="footClass"
  itemClass="itemClass"
  maskClass="maskClass" 
/>

slot

nameexplain
icon图标插槽
title标题插槽
desc副标题插槽
foot右侧副标题插槽

examples

<Block>
  <template #icon>
    <component class="blockIcon" :is="icon" />
  </template>
  <template #title>title</template>
  <template #desc>desc</template>
  <template #foot>foot</template>
</Block>

BlockGroup

property

nameexplaintypedefaultexamples
title标题Stringtitle="标题"
disabled是否禁用Booleanfalse:disabled="true"

examples

<BlockGroup groupStyle="margin:0px;" groupClass="groupClass" :disabled="true" title="title">
  <Block />
</BlockGroup>

LeftSlider

property

nameexplaintypedefaultexamples
itemClassList元素css类名StringitemClass="itemClass"
menuClass右侧按钮菜单css类名StringmenuClass="menuClass"
showBorder是否显示行间边框Booleantrue:showBorder="false"
transition滑块动画时长Number0.3:transition="0.1"
<ListGroup>
  <LeftSlider 
    v-for="item in 10"
    :key="item"
    :showBorder="true"
    :transition="0.3"
    itemClass="itemClass"
    menuClass="menuClass"
  >
    <List desc="desc" foot="foot" isLink :fun="()=>{}" :icon="IceCreamRound">
      <template #title>title{{item}}</template>
    </List>
    <template #rightMenu>
      <div style="margin: 0 20px">del</div>
    </template>
  </LeftSlider>
</ListGroup>

slot

nameexplain
rightMenu右侧按钮菜单插槽

examples

<template #rightMenu>
  <div style="margin: 0 20px">del</div>
</template>
1.0.37

3 years ago

1.0.36

3 years ago

1.0.35

3 years ago

1.0.34

3 years ago

1.0.33

3 years ago

1.0.32

3 years ago

1.0.31

3 years ago

1.0.30

3 years ago

1.0.29

3 years ago

1.0.28

3 years ago

1.0.27

3 years ago

1.0.26

3 years ago

1.0.25

3 years ago

1.0.24

3 years ago

1.0.23

3 years ago

1.0.22

3 years ago

1.0.21

3 years ago

1.0.20

3 years ago

1.0.19

3 years ago

1.0.18

3 years ago

1.0.17

3 years ago

1.0.16

3 years ago

1.0.15

3 years ago

1.0.14

3 years ago

1.0.13

3 years ago

1.0.12

3 years ago

1.0.11

3 years ago

1.0.10

3 years ago

1.0.9

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago