react-key-index 示例示例不起作用答案

【问题标题】：react-key-index sample example does not workreact-key-index 示例示例不起作用
【发布时间】：2019-07-23 03:10:04
【问题描述】：

我想使用 react-key-index 扩展来生成唯一 ID。我试图实现他们的示例示例，但无论我做什么，它仍然会抛出同样的错误：

TypeError: Hashids 不是构造函数

链接：react-key-index npmjs

这是一个非常简单的例子：

App.js：

import React from 'react';
import keyIndex from "react-key-index";
import './App.css';

function App() {
  let arr = ["one", "two", "three"];
  arr = keyIndex(arr, 1);

  const list = arr.map(arr => <li key={arr.id}>{arr.value}</li>);
  return <ul>{list}</ul>;
}

export default App;

index.js：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));
serviceWorker.unregister();

请问，您知道我在哪里做错了吗？我正在尝试将其设置为全新的反应项目（create-react-app）。从我的角度来看，我已经正确地实现了它（但显然我没有）。以下是该错误在浏览器中的样子：

【问题讨论】：

标签： reactjs npm hashids react-key-index

【解决方案1】：

您是否运行过npm install 或npm install --save hashids？ hashids 是该 npm 包的依赖项：https://www.npmjs.com/package/react-key-index

require('hashids'); 应该加载该 NPM 包（如果您已安装）；如果它没有找到它，我预计会出现这样的错误。

【讨论】：

错误在库文件中，我猜不是 OP 的代码。
我没有明确安装 hashids 但 node_modules 文件夹包含它，所以我想这不是那个问题。并且 require('hashids') 也会返回它。
@RadekAdler 在代码中的那一点，HashIds 实际上是一个构造函数，如果你在那里放一个断点？

【解决方案2】：

您似乎使用的是旧版本的react-key-index

尝试使用 V0.1.1 并检查它是否适合您。

我用 React 16.8.6 进行了尝试，它似乎对我很有效。

这里有一个Working Sample CodeSandbox 供您参考。

【讨论】：

您好，我已经完全根据您的回答重新安排了我的问题。我已经发布了我的 package.json，包括与您的项目相同的版本。它仍然不起作用。我认为，问题必须包括我在 index.js（2 个文件）中加载 app.js，但您只使用了一个文件（npmjs 中的示例代码也是如此）。其他一切都是您项目的副本。但是如果这样的细节引起这样的麻烦，我听起来很疯狂。
@SiddAjmera codesandbox 中的示例不起作用。
@Cubancoffee，不知道发生了什么！我上次看到它时它正在工作。