文章参考
问题描述
利用react-load-script
加载第三方的JS文件,我担心是否会重复加载,验证了代码之后发现不会。因此,我产生了好奇,使用webpack打包,每次import不都是不同的对象吗,那么不同的对象之间怎么记录各自的内容,让彼此知道呢?
解决思路
查看了源码之后,是将数据挂载到类
中,就是所谓的静态资源
,不同的实例实际上是都能够访问的
class写法实现实例的访问
import React from 'react';
export default class Script extends React.Component {
// A dictionary mapping script URL to a boolean value indicating if the script
// has already been loaded.
static loadedScripts = {};
componentDidMount() {
// this.constructor 就相当于 Script这个类
// this.constructor.loadedScripts 等价于 Script.loadedScripts
if (this.constructor.loadedScripts[url]) {
onLoad();
return;
}
}
}