Reactjs 未捕获类型错误：无法读取属性‘；设置状态’；未定义的

我试图显示星级，但我得到一个错误。 错误为：

未捕获类型错误：无法读取未定义的属性“setState”

class Foo extends Component {
 changeRating( newRating, name ) {
  this.setState({
  rating: newRating
  });
}
render() {
 return (
  <StarRatings
    rating={this.setState.rating}
    starRatedColor=“blue”
    changeRating={this.changeRating}
    numberOfStars={5}
    name=‘rating’
    starDimension=“20px”
    starSpacing=“8px”    
  />
);
  }
}

类Foo扩展组件{
变更评级（新评级，名称）{
这是我的国家({
评级：新评级
});
}
render（）{
返回(
);
}
}

---

有谁能指导我如何解决这个问题吗？

首先定义状态！并使用箭头功能

class Foo extends Component {
     state = {
      rating: ""
      }

 changeRating( newRating, name ) {
  this.setState({
  rating: newRating
  });
}
render() {
 return (
  <StarRatings
    rating={this.State.rating} // CHANGE
    starRatedColor=“blue”
    changeRating={() => this.changeRating} // CHANGE
    numberOfStars={5}
    name=‘rating’
    starDimension=“20px”
    starSpacing=“8px”    
  />
);
  }
}

类Foo扩展组件{
状态={
评级：“”
}
变更评级（新评级，名称）{
这是我的国家({
评级：新评级
});
}
render（）{
返回(
this.changeRating}//CHANGE
numberOfStars={5}
name='rating'
starDimension=“20px”
星形间距=“8px”
/>
);
}
}

更改

功能没有绑定或箭头功能，因此无法访问
此
。正如另一个答案所说，使用箭头函数或如果您知道性能，请使用bind do：

this.changeRating= this.changeRating.bind(this) //inside your constructor

您的代码中有两个问题：

changeRating
函数未绑定到类上下文，导致出现错误。这可以用箭头函数来解决
您正在使用
this.setState
而不是
this.state
获取您的值
以下是如何解决这两个问题：

class Foo extends Component {
  changeRating = (newRating, name) => {
    this.setState({
      rating: newRating
    });
  }

  render() {
    return (
      <StarRatings
        rating= {this.state.rating}
        starRatedColor =“blue”
        changeRating = { this.changeRating }
        numberOfStars = { 5}
        name =‘rating’
        starDimension =“20px”
        starSpacing =“8px”
      />
    );
  }
}

首先定义状态！检查我的答案！！别忘了绑定事件<代码>this.changeRating=this.changeRating.bind（this）。请尝试在要生效的箭头函数语法参数之前缺少一个
=
。定义状态不是强制性的，不会导致错误，状态变量称为
this。状态
，并且新的
更改
函数未接收任何参数
this.changeRating= this.changeRating.bind(this) //inside your constructor

class Foo extends Component {
  changeRating = (newRating, name) => {
    this.setState({
      rating: newRating
    });
  }

  render() {
    return (
      <StarRatings
        rating= {this.state.rating}
        starRatedColor =“blue”
        changeRating = { this.changeRating }
        numberOfStars = { 5}
        name =‘rating’
        starDimension =“20px”
        starSpacing =“8px”
      />
    );
  }
}

rating= {this.state.rating || "my default value"}