在React Native中安裝組件

Question

我是JS和RN的新手，目前正在使用一個應用程序，在該應用程序中遇到了一些有關處理組件的重大問題。

我嘗試過以下指南： https : //facebook.github.io/react/docs/component-specs.html以及https://facebook.github.io/react/docs/advanced-performance .html，但后一個稍微有點過頭。

但是，據我所知： componentWillMount會在執行render函數之前觸發其中的任何代碼，而componentWillUnmount會刪除它所說要忘記的所有內容。 或如何指定？

我的具體問題在於以下事實：我具有三個功能，一個主要功能，而在主要功能中我具有compOne和compTwo，當按下某個子導航器時，在主組件中將調用后者的兩個功能。 這意味着我有三個getInitialState實例，而compOne和compTwo定義了基本上相同的東西，但是調用了服務器的不同部分（因此代碼非常相同）。

同樣，當我在不同的幀之間移動並再次返回到主屏幕時，此問題有時會浮出水面。

在我的主屏幕中，它是這樣的：

var Home = React.createClass({

  getInitialState: function() {    
    return {
      componentSelected: 'One',
      userName: "Loading...",
      friendFeed: 'Loading...',
      loaded: false,
      loadedlocal: false,
    };
  },
  componentWillMount: function() {
    Method.getFriendFeed(this.props.tokenSupreme)
    .then((res) => this.setState({
      friendFeed: JSON.parse(res).friendPosts,
      loaded: true,
    }))
    .catch((error) => console.log(error))
    .done();

    Method.getLocalFeed(this.props.tokenSupreme, )
    .then((res) => this.setState({
      localFeed: JSON.parse(res).friendPosts,
      loadedlocal: true,
    }))
    .catch((error) => console.log(error))
    .done();  
  },

我在其中將this.state.friedFeed傳遞為this.props.friendData的兩個組件之一，對於localFeed則相反。

在我的CompOne中拿起它：

var ComponentOne = React.createClass({
  getInitialState: function() {
    var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
     return { 
      dataSource: ds.cloneWithRows(this.props.friendData),
   };
  },

  render: function() {
    if (!this.props.loaded) {
      return this.renderLoadingView(); 
    } else {
    return (
       <ListView 
          dataSource={this.state.dataSource} 
          renderRow={this.renderRow}
          style={styles.card} /> 
      )
    }
  },

隨后是renderRow函數等，而compTwo函數基本上是相同的。

但是我的問題是：我應該如何卸下該組件？ 如果是我想要的話？ 另一個經常但不是因此存在的問題是錯誤null is not an object (evaluating 'prevComponentInstance._currentElement'參照_updateRenderedComponent因此，我認為我應該去有關安裝，卸載和更新我的一些部件不同的方法，或者是我錯了嗎

在瀏覽不暢之后，向這個問題添加另一個問題，這可能是主要問題……RN應用程序是否有可能在多場景中處理多個列表視圖和多個提取程序？

Answer 1

在大多數情況下，您無需擔心如何卸下組件。 當不再需要React組件時，React通常會忘記它，包括它的內容，道具，狀態等componentWillUnmount通常為處於全局狀態的事物保留，一旦該組件被遺忘會導致問題如果它們仍然存在。

您鏈接到的頁面上的文檔以清除計時器為例。 在Javascript中，如果通過setTimeout() / setInterval()設置計時器，則這些計時器存在於全局空間中。 現在，假設您有一個組件，該組件設置了一個計時器來修改屏幕上的某些元素或可能嘗試與該組件進行交互，比如說未來30秒。 但是隨后用戶離開了屏幕/組件，並且由於它不再出現在屏幕上，React忘記了它。 但是，該計時器仍在運行，如果它觸發並且無法與該當前已處理的組件進行交互，則可能會導致錯誤。 componentWillUnmount使您有機會清除該計時器，從而在觸發與不再存在的元素交互時不會發生怪異的副作用。

就您而言，據我所知，您可能沒有任何需要清除的內容。 您可能想澄清一下問題，因為您沒有說自己看到的麻煩行為是什么 ，但還請注意， getInitialState僅在第一次創建組件時被調用，並且僅在props更改時不會被調用。 因此，如果friendData正在更改，但組件仍在屏幕上，則需要通過componentWillReceiveProps更新ds 。

對於最后一個問題，是的，React當然可以處理多個ListViews / fetches / etc。