Question

我上了这堂课：

{{1}}

一切正常，除了setState没有启动任何渲染（这就是为什么有一个forceUpdate（））。我在这里错过了关于fetch和setState的任何事情吗？

Answer 1

将函数传递给setState时，必须返回要更改的状态：

this.setState(state => {
  return { deck: cards };
});

这类似于执行以下操作（除了以上是batched）：

this.setState({ deck: cards });

重要的是要知道两个示例中的对象{ deck: cards }合并到现有状态。

Answer 2

您需要this.setState()来更新状态。不要改变状态。 promises也是为了使代码更干净，更少嵌套。您可以从之前的then回调中返回一个值/ promise，然后在其外部链接一个新的then，它将从上一次获得返回值，然后在解析返回的promise后返回回调或值。

＆＃13;

class Deck extends Component {
  constructor(props) {
    super(props);

    this.state = {
      deck: [],
    };
  }

  componentDidMount() {
     let _this = this;
    return fetch('URL1')
      .then(response => response.json())
      .then(deck => fetch(`URL2`))
      .then(response => response.json())
      .then(({ cards }) => {
        this.setState(state => {
          _this.setState({ deck: cards });
        });
        //_this.forceUpdate();
      });
  }

  render() {
    const { deck } = this.state;
    return deck.map((card, i) => <Card card={card} key={this.state.deck[i].code} />);
  }
}

export default Deck;

＆＃13;

Answer 3

让我们来看看你如何致电getattr(getattr(s, 'str'), 'replace')：

setState()

这会为局部变量this.setState(state => { state.deck = cards; });指定一个值，但不会更新组件的状态。使用回调更改状态的正确方法是返回新状态：

state

由于您没有从先前状态计算新状态，因此可以在不使用回调的情况下简化：

this.setState(state => {
  return {deck: cards};
});

setState没有渲染（在ftech中获取）

3 个答案: