0.2.5 • Published 1 year ago

topnet-components v0.2.5

Weekly downloads
-
License
MIT
Repository
-
Last release
1 year ago

topnet-components

基于 vue2 + ElementUI 封装的常用的业务组件

简介

topnet-components 项目是基于 Vue2 + ElementUI 技术栈打造的组件库,它搜集的是拓普项目中经常使用的业务组件。业务组件不同于 基础组件,基础组件可能考虑的更全面、使用范围更广、功能比较单一;而业务组件恰恰相反,业务组件是在基础组件的基础上进行的二 次开发,更加贴合实际开发的需要。

使用

只支持在 vue 项目中使用。可以选择全局安装使用,也可以选择按需引入。

安装:

npm i topnet-components -S

全局引入:

import topnetComponent from 'topnet-components';
Vue.use(topnetComponent);

按需引入:

import { TnTabs } from 'topnet-components'
export default {
  components: {
    TnTabs,
  },
}

项目的启动

  1. 安装项目的依赖:npm install
  2. 开发环境热启动:npm run serve | npm run dev | npm run start

历史版本

  1. 0.1.0 添加 TnTabs 组件
  2. 0.1.1 更新 TnTabs 组件
  3. 0.2.1 添加 TnConditionFilter 组件,md 文档增加组件使用说明
  4. 0.2.2 删除开发代码,只引入打包文件
  5. 0.2.3 修改 md 文档、包 package.json 文件
  6. 0.2.4 修改 md 文档,增加 TnModuleList 组件
  7. 0.2.5 修改 md 文档,增加 TnTextEllipsis 组件

相关业务组件

  1. TnTabs
参数类型说明可选值默认值
tabsArray页签数据源--
v-model/valueString绑定值,选中选项卡的 key-第一个选项卡的 key
typeString页签样式,默认选项卡样式, 还有经典样式classic-
disabledBoolean是否禁用页签truefalse
tabBgcString页签背景色-#f2f2f2
textColorString默认页签的字体颜色-#666666
activeTextColorString选中页签的字体颜色-#333333
Eventtab-changeFunction页签切换事件,参数是当前页签数据--
  1. TnConditionFilter
参数类型说明可选值默认值
sourceObject, Array过滤条件的数据源--
v-model/valueString绑定值,选中过滤条件的 key-所有项的全部
disabledBoolean是否禁止选中过滤条件truefalse
titleString过滤条件的标题-所选条件:
isMultiBoolean每项的过滤条件能否多选falsetrue
showTagsBoolean是否展示已选中的条件标签falsetrue
EventchangeFunction监听过滤条件的选择--
  1. TnModuleList 的属性及方法
参数类型说明可选值默认值
sourceObject, Array模块列表的数据源--
v-model/valueString绑定值,选中模块列表的 key--
titleString模块列表的标题-模块管理
columnNumber模块列表的列数1,2,4...3
heightNumber, String模块的高度-64px
gutterNumber模块之间的间距-10
EventchangeFunction监听模块的选择--
  1. TnTextEllipsis 的属性及方法
参数类型说明可选值默认值
contentString要展示的文本内容--
fillString文本省略填充符号-...
rowsNumber文本展示行数,与 words 同时设置时此设置失效-1
wordsNumber文本展示字符数,与 rows 同时设置时此设置生效--
positionString文本省略符号的位置startend
showTooltipBoolean文本提示框位置falsebottom
placementString监听模块的选择同 ElementUI 组件 Tooltip 的值-
effectString文本提示框主题darklight
0.2.5

1 year ago

0.2.4

1 year ago

0.2.3

1 year ago

0.2.2

1 year ago

0.2.1

1 year ago

0.1.1

1 year ago

0.1.0

1 year ago