React如何定义公共常量
定义全局常量
在React项目中，可以通过创建单独的常量文件来存放公共常量。例如创建一个constants.js文件，导出需要共享的常量。
// constants.js
export const API_URL = 'https://api.example.com';
export const MAX_ITEMS = 10;
export const DEFAULT_TIMEOUT = 5000;使用环境变量
对于敏感信息或环境相关的常量，可以使用.env文件定义环境变量。创建.env文件并定义变量，变量名需要以REACT_APP_开头。
// .env
REACT_APP_API_URL=https://api.example.com
REACT_APP_MAX_ITEMS=10通过Context共享常量
对于需要在组件树中深层共享的常量，可以使用React Context API创建一个常量上下文。
// ConstantsContext.js
import React from 'react';
const ConstantsContext = React.createContext({
API_URL: 'https://api.example.com',
MAX_ITEMS: 10,
});
export default ConstantsContext;使用Redux管理常量
在大型应用中，可以通过Redux store来管理全局常量，创建一个constants reducer。
// constantsReducer.js
const initialState = {
API_URL: 'https://api.example.com',
MAX_ITEMS: 10,
};
export default function constantsReducer(state = initialState) {
return state;
}类型化常量(TypeScript)
在使用TypeScript时，可以为常量定义类型，确保类型安全。
// constants.ts
interface AppConstants {
API_URL: string;
MAX_ITEMS: number;
}
export const CONSTANTS: AppConstants = {
API_URL: 'https://api.example.com',
MAX_ITEMS: 10,
};
