5.React 开发中的疑问:require 和 import 的区别

操作时遇到的问题:

  1.<img src={require('./images/地址.png')} alt=""/> 用img引入图片的时候,要包{require('地址')}的方式

  2.* 循环数据渲染的时候,引入图片地址会出现无法加载的问题:  

    e.path 是图片的地址

    直接src={require( e.path )}无法加载图片

    解决:
      1) src={require(""+地址)},括号中放 地址+空字符串。并且图片要在同级目录下,也就是不能出现  ../   
      2) 把相同的绝对路径写在 字符串里 -->  src={require(" ../相同的路径/xxx "+地址)} 。此时可以出现  ../   
 

React 中 require 和 import 区别是什么呢?

  这个不是 react 特有的,而是 js 共有的。require 方法是 CommonJs 推出的,NodeJs 自带了这个功能。而 import 是 ES6 推出的

ES6 中 require 和 import 等价吗?

  用 ES6 开发中,我们的代码中,会多一种模块引入语法,那就是 import 。import 会被转化为 commonjs 格式或者是 AMD 格式,所以不要把它认为是一种新的模块引用方式。babel 默认会把 ES6 的模块转化为 commonjs 规范的,你也不用费劲再把它转成 AMD 了。

  所以如下写法是等价的:

import list from './list';
//等价于
var list = require('./list');

 

原文地址:https://www.cnblogs.com/MrZhujl/p/10380707.html