fix(v-key): avoids duplicated v-for keys, for #5

ref: (since vue 2.5.10) vuejs/vue#7200

Author: fritx

examples/App.vue

@@ -14,30 +14,32 @@
       <positional-audio loop url="static/Project_Utopia.ogg"
           :volume="0.3" :position="{ y: 10 }"></positional-audio>
 
-      <movement-system :key="ui.sysKey">
-        <mass-object :rv0="{ x: 2, y: 2 }" :v0="{ x: 10 }"
-            :f="{ x: -3, y: -2 }" :m="1">
-          <cube texture="cobblestone" :size="1"></cube>
-        </mass-object>
-        <mass-object :rv0="{ x: 2, z: 2 }" :v0="{ z: 20 }"
-            :f="{ y: -1, z: -8 }" :m="1.2">
-          <cube texture="diamond" :size="1.2"></cube>
-        </mass-object>
-        <movement-object :rv0="{ x: 2, z: 2 }" :v0="{ x: 15, z: -20 }"
-            :a="{ x: -6, y: .5, z: 6 }">
-          <cube texture="redwool" :size="1.1"></cube>
-        </movement-object>
-      </movement-system>
+      <div :key="ui.sysKey">
+        <movement-system>
+          <mass-object :rv0="{ x: 2, y: 2 }" :v0="{ x: 10 }"
+              :f="{ x: -3, y: -2 }" :m="1">
+            <cube texture="cobblestone" :size="1"></cube>
+          </mass-object>
+          <mass-object :rv0="{ x: 2, z: 2 }" :v0="{ z: 20 }"
+              :f="{ y: -1, z: -8 }" :m="1.2">
+            <cube texture="diamond" :size="1.2"></cube>
+          </mass-object>
+          <movement-object :rv0="{ x: 2, z: 2 }" :v0="{ x: 15, z: -20 }"
+              :a="{ x: -6, y: .5, z: 6 }">
+            <cube texture="redwool" :size="1.1"></cube>
+          </movement-object>
+        </movement-system>
 
-      <oimo-world :key="ui.sysKey" :options="{ gravity: [0, 1, 0] }">
-        <space-system :m-scale="10 ** 4">
-          <space-object v-for="t in textures" :key="t">
-            <oimo-body :options="{ move: true, density: 1 }">
-              <cube :texture="t" :size="1"></cube>
-            </oimo-body>
-          </space-object>
-        </space-system>
-      </oimo-world>
+        <oimo-world :options="{ gravity: [0, 1, 0] }">
+          <space-system :m-scale="10 ** 4">
+            <space-object v-for="t in textures" :key="t">
+              <oimo-body :options="{ move: true, density: 1 }">
+                <cube :texture="t" :size="1"></cube>
+              </oimo-body>
+            </space-object>
+          </space-system>
+        </oimo-world>
+      </div>
     </scene>
   </renderer>
 </template>

examples/SF03.vue

@@ -7,15 +7,15 @@
       </m-obj-mtl>
     </mesh>
 
-    <mesh v-for="n in 2" :key="n" :scale="4"
+    <mesh v-for="n in 2" :key="`1-${n}`" :scale="4"
         :position="{ x: 5 * Math.sign(n - 1.5), z: 0.8 }">
       <geometry type="Plane" :args="[1, 1]"></geometry>
       <material type="MeshBasic" :options="detonation.matOpts">
         <texture url="lensflare0_alpha.png"></texture>
       </material>
     </mesh>
 
-    <object3d v-for="n in 2" :key="n"
+    <object3d v-for="n in 2" :key="`2-${n}`"
         :rotation="{ y: Math.PI / 2 }" :scale="4"
         :position="{ x: 5 * Math.sign(n - 1.5), z: 2.6 }">
       <mesh v-for="n1 in 4" :key="n1"