render 组件

 <template>
 <template>
-  <div id="app">
+<div id="app">
     <counter></counter>
     <counter></counter>
     <p>
     <p>
-      <button @click="increment">+</button>
-      <button @click="decrement">-</button>
+        <button @click="increment">+</button>
+        <button @click="decrement">-</button>
     </p>
     </p>
-  </div>
+    <child :level="1">Hello world!</child>
+    <child :level="3">Hello world!</child>
+</div>
 </template>
 </template>
 
 
 <script>
 <script>
 import counter from './components/counter.vue'
 import counter from './components/counter.vue'
-import {store} from './main.js'
+import child from './components/child.vue'
+
+import {
+    store
+} from './main.js'
 
 
 export default {
 export default {
-  name: 'app',
-  data () {
-    return {
+    name: 'app',
+    data() {
+        return {
 
 
-    }
-  },
-  computed: {
-    count () {
-	    return store.state.count
-    }
-  },
-  methods: {
-    increment () {
-      store.commit('increment')
+        }
+    },
+    computed: {
+        count() {
+            return store.state.count
+        }
+    },
+    methods: {
+        increment() {
+            store.commit('increment')
+        },
+        decrement() {
+            store.commit('decrement')
+        }
     },
     },
-    decrement () {
-    	store.commit('decrement')
+    components: {
+        counter,child
     }
     }
-  },
-  components: {
-    counter
-  }
 }
 }
 </script>
 </script>

+<script>
+export default {
+    data() {
+        return {
+
+        }
+    },
+    computed: {
+
+    },
+    mounted() {
+
+    },
+    methods: {},
+    components: {},
+    render: function(createElement) {
+        return createElement(
+            'h' + this.level,
+            this.$slots.default
+        )
+    },
+    props: {
+        level: {
+            type: Number,
+            required: true
+        }
+    }
+}
+</script>
+
+<style lang="css">
+</style>

@@ -5,19 +5,21 @@ import App from './App.vue'
 Vue.use(Vuex)
 Vue.use(Vuex)
 
 
 const store = new Vuex.Store({
 const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-  	increment: state => state.count++,
-    decrement: state => state.count--
-  }
+    state: {
+        count: 0
+    },
+    mutations: {
+        increment: state => state.count++,
+        decrement: state => state.count--
+    }
 })
 })
 
 
 new Vue({
 new Vue({
-  el: '#app',
-  store,
-  render: h => h(App)
+    el: '#app',
+    store,
+    render: h => h(App)
 })
 })
 
 
-export { store }
+export {
+    store
+}