欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 编程资源 > 编程问答 >内容正文

编程问答

(第三篇)组件化

发布时间:2024/10/6 编程问答 36 豆豆
生活随笔 收集整理的这篇文章主要介绍了 (第三篇)组件化 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

组件化

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="../node_modules/vue/dist/vue.js"></script> </head> <body><div id="app"><button v-on:click="count++">被点击了{{count}}次</button><counter></counter><button-counter></button-counter></div><script>//1、全局声明并注册组件Vue.component("counter",{template:`<button v-on:click="count++">被点击了{{count}}次</button>`,data(){return{count:1}}});//2、局部声明一个组件const buttonCounter={template:`<button v-on:click="count++">被点击了{{count}}次~~~</button>`,data(){return{count:1}}};new Vue({el:"#app",data:{count:1},components:{'button-counter':buttonCounter}})</script></body> </html>

总结

以上是生活随笔为你收集整理的(第三篇)组件化的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。