小编Geo*_*mar的帖子

引用 babel 文档https://babeljs.io/docs/en/babel-standalone#usage：

“如果您想使用浏览器对 ES 模块的本机支持，通常需要在脚本标记上设置 type="module" 属性。对于 @babel/standalone，请设置 data-type="module" 属性”

但出于某种原因，当包含我的主 index.js 文件（使用 import 导入其他 js / jsx 文件）时，babel 似乎正在将我的 import 语句转换为 require 语句，因为我收到了 ReferenceError: require is not Defined。

我发现解决这个问题的唯一方法是使用transform-modules-umd插件并将我的所有js文件作为脚本包含在内。不确定这是否是 data-type="module" 不起作用的错误，或者我是否遗漏了某些内容。

这些是我在index.html 中的脚本标签

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>

<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>

<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>

<script src="index.js" type="text/babel" data-type="module"></script>

谢谢您的帮助

在 React 中使用钩子并使用数组作为状态时，我发现使用 setter 函数仅更新该状态数组的一个元素并没有重新渲染组件。我是这样做的：

const [listCollapsed, setListCollapse] = useState(Array(props.list.length).fill(false));

const expandCollapse = (ind) => {
    let newListCollapsed = listCollapsed;
    newListCollapsed[ind] = !listCollapsed[ind];
    setListCollapse(newListCollapsed);

}

其中 expandCollapse 是按下列表元素时调用的函数。我发现将函数的第一行更改为：

let newListCollapsed = [...listCollapsed];

使它工作。我想知道对此的解释是什么。