react-native-custom-qr-codes
react-native-custom-qr-codes copied to clipboard
Don't work with react-native-cache-img lib, component doesn't re-render
First, thanks for this awesome lib! I used this lib to work with this forked react-native-cached image in my latest project. Here is code snippet:
import React from 'react';
import { View, Button } from 'react-native';
import { QRCode } from 'react-native-custom-qr-codes';
import { CachedImage } from 'react-native-cached-image;
class Demo extends React.PureComponent {
state = {
currentBg: 'https://images.unsplash.com/photo-1548744575-68926b9ec662?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80',
url: 'https://www.youtube.com'
}
// and renderBackground method
renderBackground = () => {
return (
<ImageBackground
style={styles.bg}
source={{ uri: this.state.currentBg }}
>
<QRCode content={this.state.url} size={100} />
</ImageBackground>
);
}
changeUrl = () => {
this.setState({
url: 'https://www.facebook.com'
})
}
return (
<View>
<CachedImage
renderImage={this.renderBackground}
source={{ uri: this.state.currentBg }}
/>
<Button title='Change url' onPress={this.changeUrl} />
</View>
)
}
I gave url
a initial state 'https://www.youtube.com', then I changed the state of url
to 'https://www.facebook.com', I found qrcode never re-render.
envirnoments: react: 16.5.0 react-native: 0.57.2 react-native-custom-qr-code: 2.0.0 react-native-cached-image: 'git+https://github.com/fungilation/react-native-cached-image.git' dev envirnoment: mac os platform: iOS
thanks in advanced!