陣營原住民 - 網頁視圖視頻重裝本身父狀態變化

Question

我有以下結構：

class Parent extends Component { 
    state = { isHeaderCollapsed : false } 

    render() { 
     <ScrollView decelerationRate="fast" stickyHeaderIndices={isHeaderCollapsed && [0]} scrollEventThrottle={1} onScroll={(value) => this.setState({isHeaderCollpased: true})} style={styles.body}> 
      <JobHeader collapsed={isHeaderCollapsed} /> 
      <WebView allowsInlineMediaPlayback={true} style={[styles.video, style]} javaScriptEnabled={true} source={{uri: mediaUrl}} /> 
     </ScrollView> 
    } 

在iOS上，很長的時間我更改父組件的狀態，在web視圖中的YouTube視頻自我刷新。我不希望發生這種情況。 謝謝！

Answer 1

您可以使用shouldComponentUpdate，檢查是否需要重新解析與否：

class Parent extends Component { 
    constructor(){ 
     super(); 
     this.state = { 
      isHeaderCollapsed : false 
     } 
    } 

    shouldComponentUpdate(nextProps, nextState){ 
     return nextState.isHeaderCollapsed !== this.state.isHeaderCollapsed; 
    } 

    render() { 
     <ScrollView decelerationRate="fast" stickyHeaderIndices={isHeaderCollapsed && [0]} scrollEventThrottle={1} onScroll={(value) => this.setState({isHeaderCollpased: true})} style={styles.body}> 

       <JobHeader collapsed={isHeaderCollapsed} /> 
       <WebView allowsInlineMediaPlayback={true} style={[styles.video, style]} javaScriptEnabled={true} source={{uri: mediaUrl}} /> 

     </ScrollView> 
    }