javascript 反应：导入JSON数据

Posted 2021-05-03

import React, { Component } from "react";

// Import all data from JSON as an object 'data'

import * as data from "data.json" // this option is identical to the next line
import data from "data.json";

class export default Example extends Component {
  render() {
    var example = data.key;
    return (
      <div>{data.key}</div>;
      <div>{example}</div>;
    );
  }
}


// import specific key contents as a new object 'data'

import { exampleKey } as data from "data.json"

class export default Example extends Component {
  render() {
    var example = data.key;
    return (
      <div>{data.key}</div>;
      <div>{example}</div>;
    );
  }
}


// access key contents directly - use sparingly

import { exampleKey } from "data.json";

class export default Example extends Component {
  render() {
    var example = exampleKey.key; // won't work
    return (
      <div>{exampleKey.key}</div>;
    );
  }
}