Javascript React 创建常量文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/39036457/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 22:08:24  来源:igfitidea点击:

React create constants file

javascriptreactjsconstants

提问by IntoTheDeep

How to create constants file like: key - value in ReactJs,

如何创建常量文件,如:ReactJs 中的键 - 值,

ACTION_INVALID = "This action is invalid!"

and to use that in other components

并在其他组件中使用它

errorMsg = myConstClass.ACTION_INVALID;

回答by Monads are like...

I'm not entirely sure I got your question but if I did it should be quite simple:

我不完全确定我得到了你的问题,但如果我这样做了,它应该很简单:

From my understanding you just want to create a file with constants and use it in another file.

根据我的理解,您只想创建一个带有常量的文件并在另一个文件中使用它。

fileWithConstants.js:

fileWithConstants.js:

export const ACTION_INVALID = "This action is invalid!"
export const CONSTANT_NUMBER_1 = 'hello I am a constant';
export const CONSTANT_NUMBER_2 = 'hello I am also a constant';

fileThatUsesConstants.js:

fileThatUsesConstants.js:

import * as myConstClass from 'path/to/fileWithConstants';

const errorMsg = myConstClass.ACTION_INVALID;

If you are using react you should have either webpack or packager (for react-native) so you should have babel which can translate your use of export and import to older js.

如果你正在使用 react,你应该有 webpack 或 packager(对于 react-native),所以你应该有 babel,它可以将你对导出和导入的使用转换为旧的 js。

回答by Davin Tryon

You can simply create an object for your constants:

您可以简单地为常量创建一个对象:

const myConstClass = {
    ACTION_INVALID: "This action is invalid!"
}

And then use it.

然后使用它。

If you are bundling, you can exportthis object and then importfor each component file.

如果你是捆绑的,你可以把export这个对象然后import为每个组件文件。

回答by Michael Scheper

Expanding on Monad's answer, for situations where you don't want to type myConstClassall the time:

扩展Monad 的答案,适用于您不想一直输入myConstClass的情况:

fileWithConstants.js:

fileWithConstants.js:

export const ACTION_INVALID = "This action is invalid!"
export const CONSTANT_NUMBER_1 = 'hello I am a constant';
export const CONSTANT_NUMBER_2 = 'hello I am also a constant';

fileThatUsesConstants.js:

fileThatUsesConstants.js:

import { ACTION_INVALID } from 'path/to/fileWithConstants';

const errorMsg = ACTION_INVALID;

(Also, if Monad's way works better for you, I believe the convention is for 'MyConstClass' to start with a capital letter, since it's acting like a class in code.)

(另外,如果 Monad 的方式更适合你,我相信约定是“MyConstClass”以大写字母开头,因为它在代码中就像一个类。)

回答by mixdev

One way to do that (not so different from other answers though) is to create a bare constants.js file and add your constants there. I use this for configs

一种方法(尽管与其他答案没有太大区别)是创建一个裸的 constants.js 文件并在那里添加常量。我将它用于配置

module.exports = Object.freeze({
  ACTION_INVALID :'This action is invalid',
  ACTION_VALID:'Some other action',
});

Then you can require it anywhere

然后你可以在任何地方要求它

import ConstantsList from './constants';

and use

并使用

console.log(ConstantsList.ACTION_INVALID)