bugs on day14 fixed

png won’t update bug fixed on day14.

Author: fangwei716

README.md

@@ -13,44 +13,41 @@ This project is inspired by
 ## Installation
 Require node.js , xcode & cocoapods
 
-\#1 `$ npm install`
+\#1  `$ npm install`
 
 IOS
 
-\#2 run ios/ThirtyDaysOfReactNative.xcworkspace
+\#2  run ios/ThirtyDaysOfReactNative.xcworkspace
 
 Android
 
-\#2 `$ react-native run-android`
+\#2  `$ react-native run-android`
 
 ##ToDO
 
-\#1 Add Android Support.
+\#1  Add Android Support.
+ 
+\#2  ~~iPhone Compatibility~~.
 
-\#2 ~~iPhone Compatibility~~.
+\#3  Add OSX Support. (https://github.com/ptmt/react-native-desktop)
 
-\#3 Add OSX Support. (https://github.com/ptmt/react-native-desktop)
-
-\#4 Add UWP Support when it is released. (https://blogs.windows.com/buildingapps/2016/04/13/react-native-on-the-universal-windows-platform/)
+\#4  Add UWP Support when it is released. (https://blogs.windows.com/buildingapps/2016/04/13/react-native-on-the-universal-windows-platform/)
 
 ##Compatibility
 
-Compatible with iPhone 4, 5/5s, 6/6s, 6+/6s+.
+Compatible with iPhone 4/4s, 5/5s, 6/6s, 6+/6s+.
 
 ##Running on Device
 
 https://facebook.github.io/react-native/docs/running-on-device-ios.html#content
 
 ##Known Bugs
-\#1 A warning occurs from package react-native-swiper 
+
+\#1  A warning occurs from package react-native-swiper 
 
 Solution here:
 https://github.com/leecade/react-native-swiper/pull/113/commits/e681a8e5f347efbf10b445647321b1f0865e31a4
 
-\#2 PNG format images won't update on day14 tinder switch. 
-
-Issue here: 
-https://github.com/meteor-factory/react-native-tinder-swipe-cards/issues/7
 
 ## Day 1
 An IOS-system-like stop watch.

view/day14.js

@@ -46,14 +46,15 @@ class Card extends Component{
 
 class SCard extends Component{
   static propTypes = {
+    id: React.PropTypes.string.isRequired,
     top: React.PropTypes.number.isRequired,
     width: React.PropTypes.number.isRequired,
     img: React.PropTypes.string.isRequired,
   };
 
   render(){
     return(
-      <View style={[styles.scard,{top:this.props.top,width:this.props.width}]}>
+      <View key={this.props.id} style={[styles.scard,{top:this.props.top,width:this.props.width}]}>
         <Image style={{width:this.props.width-2,height:350}} source={{uri:this.props.img}}></Image>
         <View style={styles.cardInfo}>
           <View>
@@ -82,7 +83,7 @@ class SwipeCard extends Component{
     // const simgs = ["https://media.giphy.com/media/GfXFVHUzjlbOg/giphy.gif","https://media.giphy.com/media/irTuv1L1T34TC/giphy.gif","https://media.giphy.com/media/LkLL0HJerdXMI/giphy.gif","https://media.giphy.com/media/fFBmUMzFL5zRS/giphy.gif","https://media.giphy.com/media/oDLDbBgf0dkis/giphy.gif"];
     const names=["Stuart","Bob","Kevin","Dave","Jerry"];
     const cards = simgs.map(function(elem, index) {
-      return {img:simgs[4-index], name:names[4-index], top:13+index*4, width:Util.size.width-22-index*4,}
+      return {id:"sc"+index,img:simgs[4-index], name:names[4-index], top:13+index*4, width:Util.size.width-22-index*4,}
     })
 
     this.state = {
@@ -102,7 +103,7 @@ class SwipeCard extends Component{
     return (
       <SwipeCards
         cards={this.state.cards}
-        renderCard={(cardData) => <SCard {...cardData} />}
+        renderCard={(cardData) => <SCard key={cardData.id} {...cardData} />}
         handleYup={() => this.handleYup()}
         handleNope={() => this.handleNope()}
         showYup={false}