Forráskód Böngészése

测试Vue props的更新

Michael Wang 6 éve
szülő
commit
d2b9a80d65
2 módosított fájl, 35 hozzáadás és 1 törlés
  1. 13 1
      tests/vue/child.vue
  2. 22 0
      tests/vue/props.vue

+ 13 - 1
tests/vue/child.vue

@@ -1,14 +1,26 @@
 <template>
-  <button @click="$emit('countChange', counte++)">emit value</button>
+  <div>
+    <button @click="$emit('countChange', counte++)">emit value</button>
+    <div>from parent: {{passToChild}} </div>
+    <div>from parent to computed: {{computedFromProps}} </div>
+  </div>
 </template>
 
 <script>
 export default {
   name: "child",
+  props: {
+    passToChild: String
+  },
   data() {
     return {
       counte: 0
     };
+  },
+  computed: {
+    computedFromProps: function() {
+      return "computed: " + this.passToChild;
+    }
   }
 };
 </script>

+ 22 - 0
tests/vue/props.vue

@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <div>props tests</div>
+    <Child :passToChild="passToChild" />
+  </div>
+</template>
+
+<script>
+import Child from "./child";
+export default {
+  name: "PropsTest",
+  data() {
+    return { passToChild: "Give to child " };
+  },
+  created() {
+    setInterval(() => (this.passToChild = "Give to child " + Date.now()), 1000);
+  },
+  components: {
+    Child
+  }
+};
+</script>