napoveda

src/App.vue

@@ -1,17 +1,18 @@
 <template>
   <div id="app">
-    <p>Pocet kliknuti {{ pociatdlo }}</p>
+    <p>Pocet kliknuti {{ pociatdlo }}</p> <!-- vypsání proměnné picitadlo s hodnotou 0  -->
         
     <ul>
-      <li v-for="{obrazek, index} in obrazky" :key="index">
-        <img v-on:click="obrazekclick(obrazek)" :src="obrazek.rub" alt="">
+      <li v-for="{obrazek, index} in obrazky" :key="index"> <!-- vypsání obrázků ze seznamu obrázky -->
+        <img v-on:click="obrazekclick(obrazek)" :src="obrazek.rub" alt=""> <!-- při kliknutí vyvolnín fce obrazekclick + vypsaní rubu -->
+        <!-- <img v-on:click="pociatdlo += 1" src="./assets/thumb_1.jpg"> při kliknutí navýšení pocitadlo o 1 -->
       </li>
     </ul>
   </div>
 </template>
 
 <script>
-import rub from "./assets/rub.png";
+import rub from "./assets/rub.png"; //inportování obrázků 
 import lic from "./assets/thumb_1.jpg";
 import prazdny from "./assets/prazdny.png";
 
@@ -20,9 +21,9 @@ export default {
   name: 'App',
   data: function() {
     return {
-      pociatdlo: 0,
-      obrazky: [
-        {rub: rub, lic: lic},
+      pociatdlo: 0, //definování proměnné picitadlo s hodnotou 0
+      obrazky: [ // načtení hodnot 1. název vlatnosti 2. hodnota
+        {rub: rub, lic: lic}, 
         {rub: rub, lic: prazdny},
         {rub: rub, lic: prazdny},
         {rub: rub, lic: prazdny},
@@ -34,8 +35,8 @@ export default {
   },
   methods: {
     obrazekclick: function(){
-      this.pociatdlo +- 1;
-      obrazk.rub = obrazek.lic;
+      this.pociatdlo +- 1; // navýšení čísla o 1 při kliknutí na obrázek
+      obrazek.rub = obrazek.lic;
 
 
     }
@@ -45,6 +46,9 @@ export default {
 </script>
 
 <style>
+li {
+  display: inline;
+}
 img{
   margin: 2px;
   border: 2px solid transparent;