如何验证JSON的值并将其转换为react.js中的另一个词？

Question

这是API中的JSON文件

​

​

从上面的图片中，我的状态在int中返回，以表示状态的结果。状态1意味着是批准

下面是我如何获得api数据react.js的方法

  componentDidMount(){
    const users_id = localStorage.getItem('id');

    fetch(`http://localhost:9000/api/purchase-order/list/${users_id}`,)
     .then((resp)=>{
       resp.json().then((res)=>{
           console.log(res.data);
                this.setState({data: res.data});
       })
     })
   }

render(){
    const data = this.state.data
    return (
      <div>
       <Header />
       {/* <NavigationBar /> */}
        <div>
        { Object.keys(data).map((key) => <h1>Status:{data[key].status}</h1>) }
         //Here show the status in number, but I need to show the "Approve" on here instead of 1
        </div>
      </div>
    );
  }

是否有任何解决方案或方法可以帮助验证结果状态，并在UI页面中显示真正意义的单词？

仍然有一些状态在这里，1是批准，2是待定，3被拒绝

Answer 1

将数字分配给数组

一个简单的解决方案可以是使用数字作为索引，并在上面打印一个单词。

const statusAry = ['broken', 'good', 'incomplete'];

...

{ Object.keys(data).map((key) => <h1>Status:{statusAry[data[key].status]}</h1>) }

Answer 2

您可以使用以下代码：

{ Object.keys(data).map((key) => <h1>Status:{data[key].status === 1 ? 'Approved' : 'Rejected'}</h1>) }

Answer 3

你可以这样做：

定义你的状态

​

​

然后像这样使用它：

{Status[datakey.status]}