<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="vue2.2.js"></script> <title>vue.extend-擴展實例構造器</title> </head> <body> <h1>vue.extend-擴展實例構造器</h1> <task></task> <script type="text/javascript"> var task = Vue.extend({ template: "<p><a :href='taskUrl'>{{myName}}</a></p>", data: function() { return { myName: 'baidu', taskUrl: 'http://www.baidu.com' } } }); new task().$mount('task'); </script> </body> </html>
還可以通過HTML標簽上的id或者class來生成擴展實例構造器，Vue.extend里的代碼是一樣的，只是在掛載的時候，我們用類似jquery的選擇器的方法，來進行掛載就可以了。