<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="seg1"> <alert></alert> <ttt></ttt> </div> <div id="seg2"> <alert></alert> <ttt></ttt> </div> <div id="seg3"> <texts></texts> </div> <script src="../lib/vue.js"></script> <script src="js/main.js"></script> </body> </html>
Vue.component("ttt", { template: "<button @click=\"on_click\">全局弹弹弹</button>", methods: { on_click: function () { alert("Yo.") } } }); var obj = { template: "<button @click=\"on_click\">全局弹弹弹</button>", methods: { on_click: function () { alert("Yo.") } } } new Vue({ el: "#seg1", components: { "alert": { template: "<button @click=\"on_click\">弹弹弹</button>", methods: { on_click: function () { alert("Yo.") } } } } }); new Vue({ el: "#seg2", components: { "alert": { template: "<button @click=\"on_click\">弹弹弹</button>", methods: { on_click: function () { alert("点你大爷") } } } } }); new Vue({ el:"#seg3", components:{ "texts":obj } })