search

race604 / react-native-viewpager

[Deprecated] ViewPager component for React Native
1.41k stars 373 forks source link

Add click event to viewPager #150

Open muthuraman007 opened 7 years ago

muthuraman007 commented 7 years ago

How to add click event to viewPager. If i click any image on viewpager it should respond to click event.

VincentZhangZhipeng commented 7 years ago

Add a wrapper to wrap your Image in _renderPage method. such as:

<TouchableWithoutFeedback onPress = {() => {}}>

frameworktechnology commented 6 years ago

Hello @VincentZhangZhipeng I have tried your suggested solution. it does not work for me. Here is my code - <TouchableWithoutFeedback onPress={ () => this.props.navigation.navigate('ItemImage', {image3: this.props.navigation.state.params.image1, currentImages: this.props.navigation.state.params.currentImages, indexImage: this.props.navigation.state.params.indexImage})}> <Image source={{uri: data.image}} style={styles.photoView}>

Error - Cannot read property 'navigation' of undefined onTap C:\RSSample\Woodwine\Woodwine\js\components\screens\bedsOnlyItemDetail.js:55:63 Object._invokeGuardedCallback C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:73:17 Object.invokeGuardedCallback C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:47:34 Object.invokeGuardedCallbackAndCatchFirstError C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:50:54 executeDispatch C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:125:92 Object.executeDispatchesInOrder C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:130:267 executeDispatchesAndRelease C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:3255:37 executeDispatchesAndReleaseTopLevel C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:3259:15 forEachAccumulated C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:3252:64 Object.processEventQueue C:\RSSample\Woodwine\Woodwine\node_modules\react-native\Libraries\Renderer\ReactNativeFiber-dev.js:3309:126

frameworktechnology commented 6 years ago

@muthuraman007 were you able to solve your issue? Please help my code when I want to navigate from page that uses ViewPager to a page which uses ViewPager as well.

muthuraman007 commented 6 years ago

Onpress handler doesn't have reference to your props.navigator. So need to use callback methods to solve this error