基于react,自主研发的UI组件库,求Star

#1

neo-ui

一款基于react的UI框架,采用组件分级化思想,将组件分为低阶级组件,中阶组件,高阶组件。

预览地址 http://www.wetalks.cn/neo-ui/

github https://github.com/liuyahuiZ/neo-ui

开发模式

低阶组件 :Components 部分,属于最底层的组件,跟业务毫无关联,只实现最基础应有的功能,比如Button, input, select等。将其封装暴露出该有的方法和属性,供更高阶的组件调用。

中阶组件 :Parts 部分,属于交互层的组合组件,实现一些特定业务需求的组件,比如TablePart,EditPart,SearchPart等。将其封装暴露出该有的方法和属性,供更高阶的组件调用。

高阶组件 :Templates 部分,属于最上层的组件,页面级的应用,通常是将中阶组件和低阶组件组合使用,来实现某些业务场景的交互和页面。

安装

推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用。

npm install

快速上手

import ReactDOM from 'react-dom';
import React , { Component }from 'react';
import {Components, Parts, utils} from 'neo';
const { Buttons, Input, Modal } = Components;
class Info extends Component {
    constructor(props) {
      super(props);
      this.state = {
          confirmDirty: false,
      };
    }
    render(){
        return (<Buttons
                text="confirm"
                type={'primary'}
                style={{'marginTop':'20px'}}
                onClick={() => { Modal.confirm({ title: 'warning', content: 'this is a warning', type: 'small' }, () => { alert('this is sure callback'); }, () => { alert('this is cancle callback'); }); }}
              />)
    }

效果图

1 Like
#2

图片属于外链吧, 有 expires 时间.

#3

貌似是的,图片是放阿里云oss上的。。。