0.1.13 • Published 6 years ago

react-common-module-web v0.1.13

Weekly downloads
1
License
ISC
Repository
-
Last release
6 years ago

react-common-module-web组件

公共组建用于集成各个项目中通用的组件,便于维护和使用

依赖

  • 全局变量

请确保项目中接入配置中心::配置中心负责配置项目中与推送环境相关的变量

安装

npm install react-common-module-web --registry=http://192.168.110.26:8088/repository/npm/

or

yarn add react-tree-module-web --registry=http://192.168.110.26:8088/repository/npm/

使用

  • Header--公共头部
配置中心需要配置:
window.hzConfig = {
  // 如已接入配置中心,则以下字段可以自动拉取配置,否则请根据实际情况修改字段值
  configCenter: "http://192.168.108.39:8088/api/v1",
  alarmCenter: "http://192.168.108.39:8087/api/infra-alarm/v1.0",
  infraApiOrigin: "http://192.168.108.39:8082/api/infra-uuv/v0.1", // uuv
  alarmIp: "http://192.168.108.39:8088", // 点击告警跳转的链接
  specialIp: "http://192.168.108.208:8088", // 9楼告警地址IP
  WebSocketIp: "192.168.108.39:8087", // 调用接口时把websocketIP传过来
  userCenterConfig: "http://192.168.108.39:8000"  // 用户中心回跳链接,即 infra 项目的访问地址
}
引用代码:
import { Header, TreeSelect } from "react-common-module-web";

const showType = 2; // type

class BasicLayout extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      visible: false,
      initData: []
    };
  }

  // 显示模态框
  showModalTree = () => {
    this.setState({
      visible: true
    });
  };
  //关闭模态框
  cancleModalTree() {
    this.setState({
      visible: false
    });
  }

  onSubmitModalTree(tags) {
    console.log("返回的数据", tags);
  }

  render() {

    return (
      <div>
        <div>
          <Header logoText="omga" alarmType={1}/>
        </div>
        <div>
          <Button type="primary" onClick={this.showModalTree}>
            打开新世界
          </Button>
          <TreeSelect
            onsubmit={this.onSubmitModalTree}
            initData={this.state.initData}
            title="有两个弹框请选择"
            visible={this.state.visible}
            width={950}
            config={treeConfig} 
            centered
            showType={showType}
            destroyOnClose //可配置自己选择
            onCancel={() => this.cancleModalTree()}
          />
        </div>
      </div>
    );
  }
}

export default BasicLayout;