Question

在尝试检测上下文更新时，我最终得到了以下代码。这是代码片段，手工重新输入，原谅显而易见的拼写错误

componentWillReceiveProps(nextProps) {
  if(!this.state.myChart || this.state.myChart.options.title.fontColor != this.context.muiTheme.palete.secondaryTextColor){

    const options = this.generateOptions(nextProps.options);

    this.state.myChart=new Chart(document.getElementById(nextProps.canvasId),
        type: nextProps.type,
        data: nextProps.data,
        options: options
    });
  } else{
    //updates data and calls this.state.mychart.upddate()
  }
}

generateOptions(nextProps){

  const defaultOptions = chartStyles.get(nextProps.style)  || Map({});  //chartStyles holds Immutable.Map maps of various default option styles
  const optionsWithTitle= this.addTitle(defaultOptions, nextProps.title);
  return optionsWTitle.mergeDeep(nextProps.options.toJs();
}

addTitle(options, title){
  return options.mergeDeep({ 
     title: {
          text: title,
          fontColor: this.context.muiTheme.palette.secondaryTextColor
     }
  })
 }

我收到错误循环对象值。

实验表明问题出在我的if语句中，将mychart.options.title.fontcolor与muiTheme进行比较。如果我改变比较的任何一方它是有效的。

可能导致循环对象的字符串比较是什么？

Answer 1

我认为你的问题在于设定国家。你应该在那里使用setState()方法。另外，请务必在条件中使用严格相等（！= vs！==）

componentWillReceiveProps(nextProps) {
  if(!this.state.myChart || this.state.myChart.options.title.fontColor !== this.context.muiTheme.palete.secondaryTextColor){

    const options = this.generateOptions(nextProps.options);

    const myChart = new Chart(document.getElementById(nextProps.canvasId), {
        type: nextProps.type,
        data: nextProps.data,
        options: options
    });

    this.setState({myChart: myChart})
  } else{
    //updates data and calls this.state.myChart.update()
  }
}

如果有帮助，请告诉我。

奇怪的循环对象值TypeError在比较字符串值时的反应

1 个答案: