如何在React中加载一个JSON文件

link之家

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

加载JSON文件

我们可以将JSON文件加载到react组件中，就像我们使用es6 import 语句导入JavaScript模块或CSS模块一样。

App.js

import React from "react";
import Users from "./users.json";
export default function App() {
  return (
    <div className="App">
      <h1>Users list</h1>
      {Users.map(user => (        <li key={user.id}>{user.name}</li>      ))}    </div>
在上面的代码中，我们首先将users.json 文件导入为一个Users JSON数组，并通过使用JavaScriptmap() 方法将其渲染到dom中。
  分类：
 前端
 标签：
 React.js
 
   
      安装掘金浏览器插件
     多内容聚合浏览、多引擎快捷搜索、多工具便捷提效、多模式随心畅享，你想要的，这里都有！
 前往安装
      
        FE @ MT
         21,697

推荐文章

酷酷的酱牛肉 · curl: symbol lookup error: curl: undefined symbol: curl_url_cleanup_YOLO—yeah的博客-CSDN博客

2 年前

不羁的饺子 · 记springboot重定向时报错：javax.servlet.ServletException: Could not resolve view with name ‘redirect:https:*_springboot重定向抛出错误_凹凸曼蓝博one的博客

2 年前

一直单身的丝瓜 · ssh-keygen生成公钥时faild Permission denied（已解决）_quantLearner的博客-CSDN博客

2 年前

不拘小节的瀑布 · python 读取文件时速度的问题_python读取文件速度_一只失业的小菜鸟的博客-CSDN博客

2 年前