React native componentDidMount中的React本机设置状态不起作用

我试图在

componentDidMount（）

中设置状态，但状态没有改变。我宣布各州如下：

constructor(props) {
    super(props);
    this.state = {
      links: [],
      personalInfo: {
        name: "",
        phone: "",
        email: "",
        address: {
          city: "",
          state: "",
          country: "",
        },
      },

      statement: "",
      editMode: false,
      superEditMode: false,
    }
  }

componentDidMount() {
    if (this.props.data) {
      this.props.data.personalInfo ? this.setState({personalInfo: this.props.data.personalInfo}) : null
      this.props.data.address ? this.setState({address: this.props.data.address}) : null

      //this.props.data.links ? this.setState({links: this.props.data.links}) : null
      //console.log((this.props.data.links ? true : false));
      this.setState({links: [
        {
          linkType: "Portfolio",
          linkAddress: "www.johndoe.com",
        },
        {
          linkType: "Github",
          linkAddress: "https://github.com/johndoe",
        },
        {
          linkType: "LinkedIn",
          linkAddress: "https://linkedin.com/johndoe",
        },
      ]});
      console.log(this.state.links);
      this.props.data.statement ? this.setState({statement: this.props.data.statement}) : null
    }

我的组件如下所示：

constructor(props) {
    super(props);
    this.state = {
      links: [],
      personalInfo: {
        name: "",
        phone: "",
        email: "",
        address: {
          city: "",
          state: "",
          country: "",
        },
      },

      statement: "",
      editMode: false,
      superEditMode: false,
    }
  }

componentDidMount() {
    if (this.props.data) {
      this.props.data.personalInfo ? this.setState({personalInfo: this.props.data.personalInfo}) : null
      this.props.data.address ? this.setState({address: this.props.data.address}) : null

      //this.props.data.links ? this.setState({links: this.props.data.links}) : null
      //console.log((this.props.data.links ? true : false));
      this.setState({links: [
        {
          linkType: "Portfolio",
          linkAddress: "www.johndoe.com",
        },
        {
          linkType: "Github",
          linkAddress: "https://github.com/johndoe",
        },
        {
          linkType: "LinkedIn",
          linkAddress: "https://linkedin.com/johndoe",
        },
      ]});
      console.log(this.state.links);
      this.props.data.statement ? this.setState({statement: this.props.data.statement}) : null
    }

---

非常奇怪的是，

this.state.personalInfo

this.state.address

this.state.statement

按预期从

props

设置为新状态，但是

this.state.links

仍然是初始状态

每次使用状态更改调用setState时，都会强制重新渲染。因此，我建议您做的第一件事是重构代码，以便只调用一次setState

其次，如果您认为它没有改变您的链接状态，因为

console.log（this.state.links）

仍然显示一个空数组，这可能是因为在执行该行时，状态尚未更新。setState是异步的。试试这个

if (this.props.data) {
    const { personalInfo, address, links, statement } = this.props.data;
    this.setState({
        personalInfo: personalInfo || null,
        address: address || null,
        links: links || null,
        statement: statement || null,
    }, () => {
        const { personalInfo, address, links, statement } = this.state;
        console.log({ personalInfo, address, links, statement });
    })
}

---

setState是异步的。如果您在console.log上看到的不是正常的。使用回调。