React X工程目录说明-阿里云开发者社区

React X工程目录说明

2022-11-26 92

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： React X工程目录说明

工程目录图

整体结构说明

src下的目录说明

src

assets 静态资源文件
common 定义共通的状态和数据，代码如下

    import { PAGEID } from "~/route/pageConfig";
    export enum ENV {
    DEVELOPMENT = 'development',
    PRODUCTION = 'production',
    TEST = 'test',
    }
    export const Config = {
      urlApi: '/HAG4030A',
      illegal: `^(?![\\s\\S]*(\\\\n)|[\\s\\S]*(\\\\t)|[\\s\\S]*(\\t))[\\s\\S]*$`,
      illegalCharacter: `^(?![\\s\\S]*(\\\\n)|[\\s\\S]*(\\\\t)|[\\s\\S]*(\\t)[\\s\\S]*(\\n))[\\s\\S]*$`,
      hankaku: `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789ｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝｧｨｩｪｫｯｬｭｮｰﾞﾟ ｡､!#%&()*+,-./:;<=>?@[]^_\`{|}~･｢｣$"'\\r\n`,
      youon: 'ｧｨｩｪｫｬｭｮｯ',
      pattarn: /^1[3456789]\d{9}$/,
      YYYYMMDD: /^([0-9]{4})\/([0-1][0-9])\/([0-3][0-9])$/,
      YYYYMM: /^([0-9]{4})\/([0-1][0-9])$/,
      YYMMDD: /^([0-9]{2})\/([0-1][0-9])\/([0-3][0-9])$/,
      YYMM: /^([0-9]{2})\/([0-1][0-9])$/,
      MMDD: /^([0-1][0-9])\/([0-3][0-9])$/,
      ROLLIST: /^\[(\{"rolCd":"[^({|}|,|")]+","rolKj":"[^({|}|,|")]+","shmFl":"[^({|}|,|")]+","hnbTenKb":"[^({|}|,|")]+"\},)*(\{"rolCd":"[^({|}|,|")]+","rolKj":"[^({|}|,|")]+","shmFl":"[^({|}|,|")]+","hnbTenKb":"[^({|}|,|")]+"\}\])$/g,
      yyyymmdd: /^([0-9]{4})([0-1][0-9])([0-3][0-9])$/,
      yyyymm: /^([0-9]{4})([0-1][0-9])$/,
      yymmdd: /^([0-9]{2})([0-1][0-9])([0-3][0-9])$/,
      yymm: /^([0-9]{2})([0-1][0-9])$/,
      mmdd: /^([0-1][0-9])([0-3][0-9])$/,
      tel: /^(\+?81|0)\d{1,4}[ -]?\d{1,4}[ -]?\d{4}$/,
    };
    export const Constants = {
      STORAGE_PREFIX: 'persist:',
      STORAGE_ROOT: 'root',
      STORAGE_BUSSINESS_COMMON: 'busesCommon',
      STORAGE_KEY_CLEAR_FLG: 'clearFlg',
      STORAGE_CLEAR_FLG_VAL_TRUE: '1',
      STORAGE_KEY_DIRECT_URL_ACCESS: 'direct_url_access',
      STORAGE_KEY_GMN_SNI_FLG: 'gmn_sni_flg',
      STR_TRUE:'true'
    }
    export const singlePage: string[] = [
      PAGEID.XARPAGE0010
    ]
    export const ButtonState = {
      // 照会
      BUTTEN_DO_REF_BTN: 'doRefBtn',
      // 検索
      BUTTEN_DO_SRH_BTN: 'doSrhBtn',
      // 履歴
      BUTTEN_GO_RIREKI_BTN: 'goRirekiBtn',
      // 修正
      BUTTEN_DO_UPD_BTN: 'doUpdBtn',
      // 戻る
      BUTTEN_BACK_BTN: 'backBtn',
      // 一覧
      BUTTEN_GO_ICHIRAN_BTN: 'goIchiranBtn',
    }

components 组件文件

common 共通的组件如图所示

error 报错的画面

import * as React from 'react';
export default React.memo(function NotFoundPage() {
  return (
   <> 
      <h3 style={{textAlign:'center'}}>
      <span style={{color:'#33717f'}}>システムエラー画面 -404-</span>
    </h3>
    <h4>エラー通知</h4>
    <table>
      <tr>
        <td>システムエラーが発生しました。システム管理者に連絡してください。</td>
      </tr>
    </table>
    </>;
  )
});