Javascript 多个this.setState（this.state）不重新呈现页面

在渲染中，我有一个更新属性的函数。我已经列出了被调用的函数，但我认为只有最后一个函数很重要，因为它是更新我使用的数据的函数

  <button 
    onClick={() =>
      this.handleUpdateProperty() 
    }>
    Update Properties 
  </button>

这反过来又要求：

  getDataBC = () => {
    var rentals = scFunctions.getRents();
    console.log(web3.toAscii(rentals[1][0]));


    for(let i = 0; i < rentals[0].length; i++){
      let currentProp = {
        status: rentals[0][i].toNumber(),
        location: web3.toUtf8(rentals[1][i]).replace(/\s+/g,''),
        company: web3.toUtf8(rentals[2][i]).replace(/\s+/g,''),
        price: rentals[3][i].toNumber(),
        start: rentals[4][i].toNumber(),
        end: rentals[5][i].toNumber(),
        help: "haha"
      }
      console.log(currentProp)
      this.updateDB(currentProp);
    }
    this.getDataFromDb(); 
    this.setState(this.state);
  };

最后一个函数执行以下操作：

`.then(res => this.setState({ data: res.data }))`

它更新了我用来呈现页面的数据。但是，它不会立即更新页面，我必须刷新页面才能看到按下按钮的结果。我想

.then（res=>this.setState（{data:res.data}））

你会重新翻页吗

多谢各位

编辑： 建造商如下：

  constructor(props) {
    super(props); 
    this.state = {
      data: [],
      show: false, // show of the rental modal
      company: "Homeaway", 
      id: 0,
      message: null,
      intervalIsSet: false,
      idToDelete: null,
      idToUpdate: null,
      objectToUpdate: null,
      rentProperty: "DongFang",
      startDate: new Date(),
      endDate: new Date(),
      firstName: "Ludwig",
      showConflict: true,
      lastName: "Wittgenstein"
    };
    this.handleCompanySubmit = this.handleCompanySubmit.bind(this);

  }

这就是使用来自州的“数据”的原因。因此，我希望在设置state…（状态）时，此函数重新运行并更新页面：

  renderProperties = data => {
    var properties = []
    var propRow = []
    data.forEach((property,index) => {
      propRow.push(<Col xs={{ size:3, offset: .5}}> 
        <Jumbotron>
          <Image src={require("./images/1.jpg")} fluid rounded />
          <b> {property.location} </b> 
          <h1> Price: {property.price} </h1> 
          <div> 
          {this.renderStatusButton(property)}
          </div>
        </Jumbotron> 
      </Col>)
      if((index+1)%3 == 0){ // if first in the row
        properties.push(<Row>{ propRow }</Row>)
        propRow = []
      }

    })
    return (
      <Container>
        {properties}
      </Container> 
    )
  }

---

我要睡觉了。感谢大家迄今为止的帮助。如果没有修好，那就好了。这不是关键

如果我是正确的，您只需要在提取

getDataFromDb（）

完成后刷新页面，对吗？
如果是这样，您不需要所有这些

setState（）

调用，只需要在

getDataFromDb（）

中调用一个，应该按照以下方式编写：

getDataFromDb = () => {
    fetch("http://localhost:3001/api/property")
      .then(property => property.json())
      .then(res => this.setState({ data: res.data }))
};

也就是说，您不需要编写最后一个

setState（）

调用

---

无论如何，在

getDataBC（）

中，我看到两个函数（

getRent（）

和

updateDB

）我不知道它们是做什么的，所以这些函数中可能也存在一些问题。

您希望

this.setState（this.state））可以吗？一旦用数据库中的数据更新状态，为什么还要再次更新状态？我正试图强制页面重新加载。我想可能res->this.setState阻止了它重新排序，而不仅仅是this.setState，但是.then（res=>this.setState（{data:res.data}））可以工作，因为我的数据确实得到了更新。只是我必须刷新一下page@FranktheTank
setState
调用将自动重新启动视图。在某些边缘情况下，存在
forceUpdate
function@FranktheTank您的组件有构造函数吗？如果是，请在问题中添加代码。
  renderProperties = data => {
    var properties = []
    var propRow = []
    data.forEach((property,index) => {
      propRow.push(<Col xs={{ size:3, offset: .5}}> 
        <Jumbotron>
          <Image src={require("./images/1.jpg")} fluid rounded />
          <b> {property.location} </b> 
          <h1> Price: {property.price} </h1> 
          <div> 
          {this.renderStatusButton(property)}
          </div>
        </Jumbotron> 
      </Col>)
      if((index+1)%3 == 0){ // if first in the row
        properties.push(<Row>{ propRow }</Row>)
        propRow = []
      }

    })
    return (
      <Container>
        {properties}
      </Container> 
    )
  }

   {this.renderProperties(data)} 

getDataFromDb = () => {
    fetch("http://localhost:3001/api/property")
      .then(property => property.json())
      .then(res => this.setState({ data: res.data }))
};