Merge pull request #22 from suresh-gangumalla/fix/memoryGame

Fix issue with memory game for-loop key

src/pages/MemoryGame.js

@@ -59,13 +59,13 @@ export default Blits.Component('Announcer', {
     <Element>
       <Text font="raleway" size="80" color="white" content="Let's play memory!" x="580" y="60" />
       <Text font="kalam" size="40" color="#b91c1c" content="the Accessible edition :)" x="1200" y="170" rotation="-6" />
-    
+
       <Element x="260" y="260">
         <MemoryCard
           :for="(card, index) in $cards"
           :col="$index % 4"
           :row="Math.floor($index / 4) % 3"
-          :key="$card.image"
+          key="$card.id"
           image="$card.image"
           description="$card.description"
           :ref="'card' + $index"
@@ -76,7 +76,9 @@ export default Blits.Component('Announcer', {
   `,
   state() {
     return {
-      cards: cards.concat(cards),
+      cards: cards.concat(cards).map((card, index) => {
+        return { ...card, id: `card${index}` }
+      }),
       focusedRow: -1,
       focusedCol: -1,
       openCards: [],