javascript - 如何在 ReactJS 中使用 const

标签 javascript reactjs constants

我有一个数组需要使用两次,但我不想在代码中重复它

const menuItems = [
  { route : 'home', text : 'Game Info' },
  { route : 'players-info', text : 'Players Info' },
  { route : 'money', text : 'Money' },
  { route : 'refunds', text : 'Refounds' },
  { route : 'videos', text : 'Videos' },
  { route : 'tips', text : 'Tips' }
];

在我正在做的类里面

render () {
  return <LeftNav
    menuItems={menuItems} />
}

所以,假设在另一个文件中,我想使用相同的 const menuItems,并像这样渲染它

  render () {

    let tabs = menuItems.map((item) => {
      return <Tab        
        key={item.route}
        label={item.text}
        route={item.route}
        onActive={this._onActive} />
    });

    return <Tabs
        initialSelectedIndex={0}>{tabs}
      </Tabs>;
  }

那么,我应该怎么做才能在不同文件中使用 const 呢?

最佳答案

//menuItems.js

export default const menuItems = [
  { route : 'home', text : 'Game Info' },
  { route : 'players-info', text : 'Players Info' },
  { route : 'money', text : 'Money' },
  { route : 'refunds', text : 'Refounds' },
  { route : 'videos', text : 'Videos' },
  { route : 'tips', text : 'Tips' }
];

//然后你可以像这样导入它

import menuItems from "./menuItems";

关于javascript - 如何在 ReactJS 中使用 const,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31754313/

相关文章:

javascript - 将随机数插入到类中

javascript - 无法使用 v-if 获取元素的 id

javascript - 折叠使用 vuejs 渲染的表格中的空单元格

reactjs - Enzyme/React 浅渲染昂贵吗?

javascript - MomentJS:如何将特定时区和特定格式的时间转换为毫秒

node.js - 如何在 React 中正确调用 fetch api?

javascript - 与助焊剂 react : is this the dogmatic pattern or are there equal/better options?

c++ - 从 const 引用初始化非常量对象时防止复制

c++ - 为什么复制到的对象必须与复制自的对象具有相同的低级别常量?

c++ - 将 vector <int>转换为const vector <const int>