wiz-components

目录

* 概述
* 安装
* 使用
* 许可证
* 技术栈
* 基础组件的封装

概述

wiz-components是wizlong的组件库，主要存放基础组件。组件来源目前有两种，一部分是封装了Ant Design的部分组件，另外一部分是由自己封装的组件。

安装

npm install git+https://givtlab.wizlong.com/sgm/wiz-components.git

使用

``jsx
import { WizNotice,WizAlert,WizSpin } from 'wiz-components'

//WizNoticekey;
WizNotice.info('基本信息！');
WizNotice.success({message:'成功了', description:'成功了！'});

//WizAlert


//WizSpin

`

许可证

MIT Copyright (c) 2018 - forever Naufal Rabbani




技术栈

* Ant Design




组件的封装

组件化是React中的重要概念，React提供了Component作为基础组件，它实现了React生命周期方法、class 属性(defaultProps、displayName)、实例属性(props、state)及其他api。wiz-components对其进行了封装，优化了一些方法及功能，它的名字叫WizComponent。

#####1. 组件名称 componentName
使用WizComponent时需要定义 component的名称。

#####2. React生命周期方法shouldComponentUpdate的封装
WizComponent对生命周期的shouldComponentUpdate方法进行了封装=>propsAndStateOnChange，优化了实例属性发生变化时的性能优化。
######propsAndStateOnChange使用方法
`js
//对所需要的实例属性进行监听
propsAndStateOnChange = {
listen: this._listen.bind(this)
}

//监听方法，入参与shouldComponentUpdate的相同
_list(nextProps,nextState){
//do something
}

``