首页 > 解决方案 > 我如何将 Json 数据发布到我的状态 ReactJs

问题描述

请帮助我,我在下面有这种格式的数据,这种数据格式是由应用程序后端的另一个格式完成的

什么时候空是这样的

"opening_time":{"Mon":[["0"],["0"]],
"Tue":[["0"],["0"]],
"Wed":[["0"],["0"]],
"Thu":[["0"],["0"]],
"Fri":[["0"],["0"]],
"Sat":[["0"],["0"]],
"Sun":[["0"],["0"]]}

当我从提交按钮发送数据时,我想保存如下数据:

"opening_time":{"Mon":[["1","07:00","12:00"],["1","13:00","17:00"]],
"Tue":[["1","07:00","12:00"],["1","13:00","17:00"]],
"Wed":[["1","07:00","12:00"],["1","13:00","17:00"]],
"Thu":[["1","07:00","12:00"],["1","13:00","17:00"]],
"Fri":[["1","07:00","12:00"],["1","13:00","17:00"]],
"Sat":[["1","07:00","14:00"],["0"]],
"Sun":[["0"],["0"]]}

让我解释

"Thu":[["1","07:00","12:00"],["1","13:00","17:00"]],

"thu"=is day ["1","07:00","12:00"] => 第一班/ "1" 有效, "07:00" 第一班开放时间, "12:00 " 如果第一次轮班我创建了如下状态,则关闭时间

class OpeningTime extends Component {
  constructor(props) {
    console.log(props)
    super(props)
    this.state = {
      opening_time:
      {"Mon":[[""],[""]],
      "Tue":[[""],[""]],
      "Wed":[[""],[""]],
      "Thu":[[""],[""]],
      "Fri":[[""],[""]],
      "Sat":[[""],[""]],
      "Sun":[[""],[""]]} 
    }

我不知道如何访问opening_time的每个项目以从我的输入onChange函数中保存我的数据,我尝试了很多尝试但我没有找到解决方案,我被阻止了有人可以帮我吗

标签: javascriptjsonreactjssetstate

解决方案


创建此函数以更新开放时间

updateOpeningTime = (field,val) => {
    this.setState(prevState => {
        let updatedOpeningTime = {...prevState.opening_time}


        updatedOpeningTime[field] = val
        return {opening_time: updatedOpeningTime}
    })
}

然后像这样使用它

//                                     Set day and value dynamically
onChange={() => this.updateOpeningTime('Sat',[["1","07:00","12:00"],["1","13:00","17:00"]])}

希望这可以帮助


推荐阅读