如何在Javascript/React中将文本响应作为代码进行评估
如何在Javascript/React中将文本响应作为代码进行评估
提问于 2019-06-26 21:25:37
我正在使用react从服务器获取响应。我本质上是从图表中抓取数据来制作更好的图表。无论如何，返回的响应都是javascript变量
'var x = [["data","like"this"],["and","like","this"]]'当我使用普通的.js文件时，我可以计算响应，然后返回x，它就可以工作了。
但是，当在React类中运行时，相同的代码不能工作。
有人知道为什么或者是因为某种原因该变量附加到了不同的作用域吗？我的印象是react不是在严格模式下运行的，所以我认为eval应该在设置变量方面工作。
import React from "react";
import ReactDom from "react-dom";
class App extends React.Component {
constructor(props) {
super(props);
this.state = {};
}
componentDidMount() {
this.getData();
}
getData() {
fetch("url-to-scrape")
.then(function(response) {
return response.text();//only way I can view the response
})
.then(data => {
eval(data) //should set variable x
console.log(x)// this is where I will setState
});
}
render() {
return (
<div>
<p>Smarter Chart</p>
</div>
);
}
}
ReactDom.render(<App />, document.getElementById("app"));
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-06-27 08:04:34
我不知道为什么我的响应返回为Javascript变量。不管怎样，我找到了在React中解析这些数据的方法。
import React from "react";
import ReactDom from "react-dom";
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
data: []
};
}
componentDidMount() {
fetch("url-to-scrape")
.then(response => { //ReadableStream hiding response
return response.text(); //Convert ReadableStream to text
})
.then(data => {
var data_from_x = eval(data + "; x;"); //eval x and return it
this.setState({data: data_from_x });
})
}
render() {
return (
<div>
<p>welcome to the app</p>
</div>
);
}
}
ReactDom.render(<App />, document.getElementById("app"));
我计算响应文本，它是eval中的字符串数据，然后添加+ '; x;'，它在eval中调用变量'var x = data'。我将数据设置为一个变量，然后返回它，在我的例子中，返回的是setState。我现在有了一个完全定制的图表所需的大量数据。
在我得到多个变量的情况下，我可以通过名称以相同的方式拉出所有变量。
Stack Overflow用户
发布于 2019-06-26 23:05:56
由于您希望使用x，因此数据似乎有一个有保证的结构。假设这是一个单变量声明，您可以通过抓取紧跟在等号后面的子字符串将其提取到json中。虽然此代码需要更改，但如果响应中有多个变量，则与eval相比，它既可以安全使用，又不会出现作用域问题。
const response = 'var x = [["data","like", "this"],["and","like","this"]]'
const output = JSON.parse(response.substring(response.indexOf('=') + 1))
console.log(output)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56773941
复制相关文章
相似问题
腾讯云开发者
