當模式打開時，停止傳播新聞事件/防止在React-Native應用程序上冒泡

我目前正在使用React-Native移動應用程序。當模式打開時，停止傳播新聞事件/防止在React-Native應用程序上冒泡

我有一個PanResponder設置在我的主視圖。我的主視圖創建了一個包含Modal的組件。

我的問題是當Modal打開時，PanResponder低於模態（在主視圖中）仍然響應滑動事件，並且我試圖阻止它們。

我試圖在Modal本身中創建一個PanResponder來阻止後面的一個，但它不起作用。

MainView.js

componentWillMount() { 
    this.panResponder = PanResponder.create({ 
     onStartShouldSetPanResponderCapture:() => false, 
     onMoveShouldSetPanResponderCapture:() => true, 
    }); 
} 
render() { 
    return (
     <View {...this.panResponder.panHandlers}> 
      {...} 
      <SubView /> 
     </View> 
    ) 
}

SubView.js

componentWillMount() { 
    // Tentative of blocking the main view PanResponder 
    this.panResponder = PanResponder.create({ 
     onStartShouldSetPanResponder:() => true, 
     onStartShouldSetPanResponderCapture:() => true, 
     onMoveShouldSetPanResponder:() => true, 
     onMoveShouldSetPanResponderCapture:() => true, 
    }); 
} 
render() { 
    return (
     <Modal transparent {...this.panResponder.panHandlers}> 
      {...} 
     </Modal> 
    ) 
}

我想避免更改主視圖PanResponder集，我不希望它要知道是否有模態打開或沒有。

你知道一個很好的解決方案來阻止事件的傳播嗎？

感謝

來源

2016-08-12 alexmngn

你可以添加你的主視圖泛響應者代碼嗎？ – while1

我用它看起來像編輯帖子。 – alexmngn

您是否嘗試在父視圖上將onMoveShouldSetPanResponderCapture設置爲false？也許反應本土並不清楚這一點。但是，如果onMoveShouldSetResponderCapture在父視圖中返回true，則按照http://facebook.github.io/react-native/releases/0.31/docs/gesture-responder-system.html#capture-shouldset-handlers。父母將捕捉觸摸。並在onMoveShouldSetPanResponderCapture內部設置onMoveShouldSetResponderCapture。 – while1

那麼，爲什麼你在子視圖方法返回true，如果你不想爲這些手勢迴應。我想你應該返回false：

this.panResponder = PanResponder.create({ 
    onStartShouldSetPanResponder:() => false, 
    onStartShouldSetPanResponderCapture:() => false, 
    onMoveShouldSetPanResponder:() => false, 
    onMoveShouldSetPanResponderCapture:() => false, 
});

還從文檔：

因此，如果父視圖要防止孩子成爲應答上的觸摸開始，它應該有一個onStartShouldSetResponderCapture 處理程序返回true。

View.props.onStartShouldSetResponderCapture: (evt) => true, 
View.props.onMoveShouldSetResponderCapture: (evt) => true,

來源

2016-08-24 21:08:14 elf2707

當模式打開時，停止傳播新聞事件/防止在React-Native應用程序上冒泡

回答

相關問題