javascript - react 状态属性指的是自己范围内的属性

Question

这个问题在这里已经有了答案:





Self-references in object literals / initializers

(26 个回答)


2年前关闭。




有没有办法让 React 状态对象中的属性引用它自己的属性？就像下面的例子:

this.state = {
    currentTotal: 30,
    columnLength: Math.ceil(this.currentTotal / 3), // Getting NaN.
}

Answer 1

这里的问题是 this.currentTotal未定义，这将在此算术过程中产生 NaN:this.currentTotal / 3 .

有几种方法可以解决这个问题，但也许最简单的解决方案是推迟 Math.ceil(this.currentTotal / 3)计算直到您的组件 state完全初始化如下:

class Component {

  constructor() {
  
    const state = {
      currentTotal: 30,
      columnLength: 0
    }
    
    // Defer calculation til after state has been initialised
    state.columnLength = Math.ceil(state.currentTotal / 3)
    
    // Assign your initialised to the component
    this.state = state

    console.log( this.state.columnLength )
  }
  
}

new Component()