chore: organize the example structure

ZeyanGuo · Feb 4, 2021 · 3fc7494 · 3fc7494
1 parent c0212c0
commit 3fc7494
Show file tree

Hide file tree

Showing 20 changed files with 94 additions and 70 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/example/App.js b/example/App.js
diff --git a/example/components/componentEmit.js/App.js → example/componentEmit.js/App.js b/example/components/componentEmit.js/App.js → example/componentEmit.js/App.js
@@ -1,7 +1,7 @@
 // 组件 emit 逻辑 demo
 // click emit 发出 change， 可以触发 App 组件内定义好的侦听函数
 // 允许接收多个参数
-import { h, ref, reactive } from "../../../lib/mini-vue.esm.js";
+import { h, ref, reactive } from "../../lib/mini-vue.esm.js";
 import Child from "./Child.js";
 
 export default {

diff --git a/example/components/componentEmit.js/Child.js → example/componentEmit.js/Child.js b/example/components/componentEmit.js/Child.js → example/componentEmit.js/Child.js
@@ -1,4 +1,4 @@
-import { h, ref, reactive } from "../../../lib/mini-vue.esm.js";
+import { h, ref, reactive } from "../../lib/mini-vue.esm.js";
 export default {
   name: "Child",
   setup(props, { emit }) {

diff --git a/...le/components/componentEmit.js/index.html → example/componentEmit.js/index.html b/...le/components/componentEmit.js/index.html → example/componentEmit.js/index.html
diff --git a/example/components/HelloWorld.js b/example/components/HelloWorld.js
diff --git a/example/helloWorld/App.js b/example/helloWorld/App.js
@@ -0,0 +1,24 @@
+import { h,ref } from "../../lib/mini-vue.esm.js";
+
+const count = ref(0)
+
+const HelloWorld = {
+  name: "HelloWorld",
+  setup() {},
+  render() {
+    return h(
+      "div",
+      { tId: "helloWorld" },
+      `hello world: count: ${count.value}`
+    );
+  },
+};
+
+export default {
+  name: "App",
+  setup() {},
+
+  render() {
+    return h("div", { tId: 1 }, [h("p", {}, "主页"), h(HelloWorld)]);
+  },
+};
diff --git a/example/index.html → example/helloWorld/index.html b/example/index.html → example/helloWorld/index.html
diff --git a/example/helloWorld/main.js b/example/helloWorld/main.js
@@ -0,0 +1,5 @@
+import { createApp } from "../../lib/mini-vue.esm.js";
+import App from "./App.js";
+
+const rootContainer = document.querySelector("#root");
+createApp(App).mount(rootContainer);
diff --git a/example/nextTicker/App.js b/example/nextTicker/App.js
@@ -0,0 +1,11 @@
+import { h, ref, reactive } from "../../lib/mini-vue.esm.js";
+import NextTicker from "./NextTicker.js";
+
+export default {
+  name: "App",
+  setup() {},
+
+  render() {
+    return h("div", { tId: 1 }, [h("p", {}, "主页"), h(NextTicker)]);
+  },
+};
diff --git a/example/components/NextTicker.js → example/nextTicker/NextTicker.js b/example/components/NextTicker.js → example/nextTicker/NextTicker.js
diff --git a/example/nextTicker/index.html b/example/nextTicker/index.html
@@ -0,0 +1,15 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+
+    <div id="root"></div>
+
+    <script src="main.js" type="module"></script>
+</body>
+</html>
diff --git a/example/main.js → example/nextTicker/main.js b/example/main.js → example/nextTicker/main.js
@@ -1,4 +1,4 @@
-import {createApp} from "../lib/mini-vue.esm.js";
+import {createApp} from "../../lib/mini-vue.esm.js";
 import App from "./App.js";
 
 const rootContainer = document.querySelector("#root");

diff --git a/example/patchChildren/App.js b/example/patchChildren/App.js
@@ -0,0 +1,11 @@
+import { h } from "../../lib/mini-vue.esm.js";
+import PatchChildren from "./PatchChildren.js";
+
+export default {
+  name: "App",
+  setup() {},
+
+  render() {
+    return h("div", { tId: 1 }, [h("p", {}, "主页"), h(PatchChildren)]);
+  },
+};
diff --git a/example/components/PatchChildren.js → example/patchChildren/PatchChildren.js b/example/components/PatchChildren.js → example/patchChildren/PatchChildren.js
diff --git a/example/patchChildren/index.html b/example/patchChildren/index.html
@@ -0,0 +1,15 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+
+    <div id="root"></div>
+
+    <script src="main.js" type="module"></script>
+</body>
+</html>
diff --git a/example/patchChildren/main.js b/example/patchChildren/main.js
@@ -0,0 +1,5 @@
+import { createApp } from "../../lib/mini-vue.esm.js";
+import App from "./App.js";
+
+const rootContainer = document.querySelector("#root");
+createApp(App).mount(rootContainer);
diff --git a/example/components/renderComponent.js/App.js → example/renderComponent.js/App.js b/example/components/renderComponent.js/App.js → example/renderComponent.js/App.js
@@ -1,4 +1,4 @@
-import { h, ref, reactive } from "../../../lib/mini-vue.esm.js";
+import { h, ref, reactive } from "../../lib/mini-vue.esm.js";
 import Child from "./Child.js";
 
 export default {

diff --git a/...le/components/renderComponent.js/Child.js → example/renderComponent.js/Child.js b/...le/components/renderComponent.js/Child.js → example/renderComponent.js/Child.js
@@ -1,4 +1,4 @@
-import { h, ref, reactive } from "../../../lib/mini-vue.esm.js";
+import { h, ref, reactive } from "../../lib/mini-vue.esm.js";
 export default {
   name: "Child",
   setup(props, context) {

diff --git a/.../components/renderComponent.js/index.html → example/renderComponent.js/index.html b/.../components/renderComponent.js/index.html → example/renderComponent.js/index.html