Add files via upload

isunny0416 · Jul 8, 2019 · 01fd802 · 01fd802
1 parent 63f9613
commit 01fd802
Show file tree

Hide file tree

Showing 3 changed files with 86 additions and 0 deletions.
diff --git a/Vue.js 반응기법/Vue.js 반응기법.ppt b/Vue.js 반응기법/Vue.js 반응기법.ppt
diff --git a/Vue.js 반응기법/defineProperty.txt b/Vue.js 반응기법/defineProperty.txt
@@ -0,0 +1,54 @@
+var obj = {
+
+   data: {
+
+      a: 100
+
+   }
+
+};
+
+
+Object.defineProperty(obj, "a", {
+  set: function(x) {
+    console.log("## setter call : ", x);
+    this.data.a = x;
+  },
+  get: function() {
+    console.log("## getter call : ", this.data.a);
+    return this.data.a;
+  },
+  enumerable: true,
+  configurable: true
+});
+
+--------------------------------
+
+var obj = {
+
+   data: {
+
+      a: 100
+, b:200, c:300
+   }
+
+};
+
+
+for (var k in obj.data) {
+
+  (function(k) {
+    Object.defineProperty(obj, k, {
+      set: function(x) {
+        console.log("## setter call : ", k, x);
+        this.data[k] = x;
+      },
+      get: function() {
+        console.log("## getter call : ", k, this.data[k]);
+        return this.data[k];
+      },
+      enumerable: true,
+      configurable: true
+    });
+  })(k);
+}
diff --git a/Vue.js 반응기법/reactive.html b/Vue.js 반응기법/reactive.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>reactive</title>
+  <script src="https://unpkg.com/vue/dist/vue.js"></script>
+</head>
+<body>
+  <div id="test">
+    <div id="a1">{{num}}</div>
+    <button @click="add">100씩 증가</button>
+  </div>
+  <script type="text/javascript">
+
+  var vm = new Vue({
+    el : "#test",
+    data : {
+        num: 100
+    },
+    methods: {
+        add: function() {
+            this.num += 100;
+            this.$nextTick(function() {
+                var strNum = document.getElementById("a1").innerHTML;
+                console.log(strNum);
+            });
+        }
+    }
+  })  
+  </script>
+</body>
+</html>