0.0.3 • Published 3 months ago

juejin-ui v0.0.3

Weekly downloads
-
License
ISC
Repository
-
Last release
3 months ago

jj-UI

介绍

jj-ui,个人以自己工作项目经验需求而实现的组件库

软件架构

vite+vue3+typescript

安装教程

已上线npm： 

npm i jj-ui

使用说明

全局引入： 

import JJUI from 'jj-ui'

createApp(App).use(JJUI).mount('#app')

修改样式 ：使用的都是‘弱样式’，即只需要增加组件内对应的class的优先级即可修改，嵌套父级选择器即可

分页器组件

引入：

import { windPagination } from 'jj-ui'

demo示例： 

<wind-pagination  
      class="pagination"  
      :total-num="testList.length"  
      :total-list="testList"  
      :show-num="showNum"  
      :one-page-num="onePageNum"  
      @now-list="getNowList"  
      @now-page="getNowPage"  
    ></wind-pagination>
props
total-list : Array可选 ，将整个数据列表传递过去，然后可通过监听now-list去获取当前页的数据
show-num : Number可选 ，可以将每一个页看成一个格子，有多少个格子的意思，默认9个
total-num : Number必选 ，数据的总条数，需要根据这个总条数来计算多少页和页面的布局(是否需要省略)
one-page-num : Number可选 ，一页有多少条数据，默认50
emits
now-list( list : Array )需要配合total-list使用，获取当前页的数据
now-page( page : Number )获取当前的页码
样式修改的class
page最外层div
pre上一页按钮
next下一页按钮
pageItem页码按钮

输入图片说明

弹窗组件

参与贡献

更新日志

v1.1.15 完成按需引入

v0.0.1 第一个正式版，完成基础包

tailwindcssweapp-tailwindcsslessvue
0.0.3

3 months ago