Question

我想在我的反应应用程序中加载另一个包含变量数组的.js

arrayCode.js
var arrayCode=["1","2","3","4","5"];

in component.js

componentDidMount() {
const script = document.createElement("script");

        script.src = "/arrayCode.js";
        script.async = true;

        document.body.appendChild(script);

}

以及如何在组件状态下加载arrayCode。

Answer 1

如果您的arrayCode.js总是一个简单的数组，我建议您将其更改为arrayCode.json，然后使用GET请求检索json并使用内置JSON.parse解析它。 / p>

那就是说，如果有一些特定的原因你需要它作为.js文件，那么你总是可以在响应上做一个GET和eval。

componentWillMount() {
    fetch('/arrayCode.js')
        .then(res => res.text())
        .then(text => {
            eval(text);

            // You now have access to arrayCode var
            console.log(arrayCode);
            this.setState({
                array: arrayCode
            })
        });
}

如果您可以将arrayCode.js移动到arrayCode.json，那么您的arrayCode.json将如下所示

["1","2","3","4","5"]

您的componentWillMount可以成为：

componentWillMount() {
    fetch('/arrayCode.json')
        .then(res => res.json())
        .then(json => {
            const array = JSON.parse(json);

            // You now have access to arrayCode var
            console.log(array);
            this.setState({
                array,
            })
        });
}

从加载异步的外部.js中反应获取Array

1 个答案: