当可见性状态未更改时，为什么本机警报组件会呈现两次？

Question

我有一个警报组件，一旦我将代码添加到主组件中的 componentWillMount 就会呈现两次。 The project is an expo project

我通过将属性控制警报组件的可见性设置为 false 然后调用 this.startAlert() 来解决它，这会更改 componentWillMount 过程中的可见性状态。在解决方法之前，可见性状态仅在按下对话框上的按钮后才发生变化。

这行得通。它显示一次警报对话框。 this.startAlert();在承诺中执行。

componentWillMount() {

    const  setPosition = (pos) => {

        console.log(pos) ;

    // We need the "latitude" and the "longitude"
    // in order to lookup the "address" from the
    // Google maps API.
    const {
      coords: {
        latitude,
        longitude,
      },
    } = pos;

    // Fetches data from the Google Maps API then sets
    // the "address" state based on the response.
    fetch(`${URL}${latitude},${longitude}`)
      .then(resp => resp.json(), e => console.error(e))
      .then(({
        results: [
          { formatted_address },
        ],
      }) => {
            this.setAddress( formatted_address ) ;
            this.startAlert() ;         
      });
    } ;


    navigator.geolocation.getCurrentPosition(setPosition) ;

}

而这失败了。警报组件显示两次。 this.startAlert();在提取承诺之外调用。

componentWillMount() {

    const  setPosition = (pos) => {

        console.log(pos) ;

    // We need the "latitude" and the "longitude"
    // in order to lookup the "address" from the
    // Google maps API.
    const {
      coords: {
        latitude,
        longitude,
      },
    } = pos;

    // Fetches data from the Google Maps API then sets
    // the "address" state based on the response.
    fetch(`${URL}${latitude},${longitude}`)
      .then(resp => resp.json(), e => console.error(e))
      .then(({
        results: [
          { formatted_address },
        ],
      }) => {
            this.setAddress( formatted_address ) ;      
      });
    } ;

    this.startAlert() ; 
    navigator.geolocation.getCurrentPosition(setPosition) ;

}

为什么在可见性状态未更改时，react-native 警报组件会呈现两次？

编辑：设置地址的代码。

// Getter for "Immutable.js" state data...
get data() {
  return this.state.data;
}

// Setter for "Immutable.js" state data...
set data(data) {
  this.setState({ data });
}

setAddress = (address) => {
    this.data = this.data.set('address', address ) ;
}

Answer 1

可能有助于突出显示两个代码片段之间的特殊差异，因为乍一看，甚至是阅读一点点，它们看起来基本相同。 this.setAddress(...)的定义好像没有包含但是它是否传递调用this.setState(...)？ this.setState(...) 导致重新渲染 this。

当可见性状态未更改时，为什么本机警报组件会呈现两次？

Why would a react-native alert component render twice when the visibility state was not changed?

react-native

expo