<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>qdabc.cn</title> <script src="https://unpkg.com/vue/dist/vue.js"></script> </head> <body> <!-- 替换<div id="app"></div> 包括 --> <div id="app"></div> <script> var abc = Vue.component('abc',{ template: '<div id="app">这里是index</div>' }); new Vue({ el: '#app', render: function (h) { // console.log(h); // render是个函数 接收的一个参数 通过执行这个参数( ) 并且return return h(abc) // 需要传递一个参数 } }) </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://unpkg.com/vue/dist/vue.js"></script> </head> <body> <div id="app"> <!-- ref="自定义的名字" --> <p @click="dom">点击</p> <ul ref="abc"> <li> 123 </li> </ul> <div ref="def"> </div> </div> <script> new Vue({ el: '#app', methods: { dom () { console.log(this.$refs.abc); } } }) </script> </body> </html>
欢迎分享本文,转载请保留出处:前端ABC » vue 中的render函数和ref