【问题标题】:setState for nested objects嵌套对象的 setState
【发布时间】:2017-10-22 09:59:57
【问题描述】:

我有一个嵌套对象作为状态,我在组件中有一个表单。我正在考虑每次用户在表单中输入内容时更新状态,并避免为每个输入创建许多函数,我正在考虑使用 switch 创建单个函数。

  1. 用 switch 创建单个函数是个好主意吗?
  2. 如何更新对象的单个嵌套元素?

我尝试了以下代码,但它不起作用:

class App extends Component {
  constructor(props) {
      super(props)
      this.state = {
        minutes: null,
        interests: {
          business: false,
          code: false,
          design: false
        },
        errors: []
      }
  }

  updatePreferences = (preferenceName, enteredValue) => {
    switch (preferenceName) {
      case preferenceName === "minutes":
        this.setState({minutes: enteredValue})
        return
      case preferenceName === "business":
        this.setState({interests.business: !this.state.interests.business})
        return
      case default:
        return
    }

  }
}

【问题讨论】:

    标签: javascript reactjs jsx


    【解决方案1】:

    当然你可以使用switch,AFAIK 没有错。

    并使用setState 更新嵌套对象。看例子

      updatePreferences = (preferenceName, enteredValue) => {
         switch (preferenceName) {
          case preferenceName === "minutes":
            this.setState({minutes: enteredValue});
            return
          case preferenceName === "business":
            this.setState({...this.state, interests: {
              ...this.state.interests,
              business: !this.state.interests.business
            }});
            return
          default:
            return
        }
    
      }
    

    【讨论】:

    • 太棒了!只是default 而不是case default
    • 抱歉,错过了
    猜你喜欢
    • 2020-07-30
    • 1970-01-01
    • 1970-01-01
    • 2020-02-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多