Day 1之用OData提供的数据将其填入一个table里

效果图：

工具：
1.ant design为react提供的table组件
2.react里fetch的插件
3.odata v2提供的数据（readonly）

问题及解决方案

1.首先是不会用odata，打开之后全是xml有点蒙，选择一个Name里的属性在斜杠后面填上进入这个属性里的更多元数据。但是我想要json格式，因为要填进表格里。
方法：
在Name属性后加上

1

?$format=json

2.在用fetch的时候跨域了
报错如图

方法：（主要针对Chrome）
1).在cmd里输入命令行

1

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir

2).在Chrome的webstore里搜索allow control
添加如图插件

在浏览器右上角找到cors 点开enable那个按钮就搞定

3.在fetch后的promise回调中，获取到了fetch传来的promise实例，但是再转换为json()后的回调拿不到下一个promise实例

方法：
如图红线标注处

1

response.json();

4.异步回调的两种写法
1).用then

2)用async和await

5.this.forceUpdate()的使用
因为在本实例中，驱动渲染的是dataInfo这个数组里的内容，和state与pros无关，所以加了这个方法强制渲染。
forceUpdate就是重新render。有些变量不在state上，但是你又想达到这个变量更新的时候，刷新render；或者state里的某个变量层次太深，更新的时候没有自动触发render。这些时候都可以手动调用forceUpdate自动触发render。

6.总结
最开始在constructor中初始化了state，原本的想法是拿到response.json()后的promise实例把他的值用this.setState()方法赋到state里，但是后来发现this.setState()是一个异步的操作，并不清楚具体在哪个时间赋值完成，所以arr一直拿不到值for循环就会报错，因为用到了arr.length，但此时arr是undefined，undefined没有length属性，浏览器报错。在尝试了各个生命周期之后，发现this.setState()的赋值在componentDidUpdate这个生命周期的时候赋值完成，但是此时把值交到arr再用for循环向dataInfo里赋值过后渲染的已经完成了，并不会在页面显示出什么来。就算加上this.forceUpdate()也不会在页面上渲染什么，只是会无限循环componentDidUpdate的赋值过程。