Vue學(xué)習(xí)筆記分享之Vue組件化編程
2.1 模塊與組件、模塊化與組件化
2.1.1.模塊
理解:向外提供特定功能的js程序,一般就是一個js文件
為什么:js文件很多很復(fù)雜
作用:復(fù)用js,簡化js的編寫,提高js運行效率
2.1.2.組件
理解:用來實現(xiàn)局部(特定)功能效果的代碼集合(html/css/image…)
為什么:一個界面的功能很復(fù)雜
作用:復(fù)用編碼,簡化項目編碼,提高運行效率
2.1.3.模塊化
當(dāng)應(yīng)用中的js都以模塊來編寫的,那這個應(yīng)用就是一個模塊化的應(yīng)用。
2.1.4.組件化
當(dāng)應(yīng)用中的功能都是多組件的方式來編寫的,那這個應(yīng)用就是一個組件化的應(yīng)用。
2.2.非單文件組件
模板編寫沒有提示
沒有構(gòu)建過程,無法將ES6轉(zhuǎn)換成ES5
不支持組件的CSS
真正開發(fā)中幾乎不用
2.3單文件組件
2.3.1.一個.vue文件的組成(3個部分)
1、模板頁面
<template> 頁面模板 </template>
2、JS模塊對象
<script> export default { data() { return {} }, methods: {}, computed: {}, components: {} } </script>
3、樣式
<style> 樣式定義 </style>
2.3.2.基本使用
- 引入組件
- 映射成標(biāo)簽
- 使用組件標(biāo)簽
到此這篇關(guān)于Vue學(xué)習(xí)筆記分享之Vue組件化編程的文章就介紹到這了,更多相關(guān)Vue組件化編程內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
淺談vue后臺管理系統(tǒng)權(quán)限控制思考與實踐
這篇文章主要介紹了淺談vue后臺管理系統(tǒng)權(quán)限控制思考與實踐,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-12-12vue中{{}},v-text和v-html區(qū)別與應(yīng)用詳解
這篇文章主要介紹了vue中{{}},v-text和v-html區(qū)別與應(yīng)用詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下2021-09-09讓webpack+vue-cil項目不再自動打開瀏覽器的方法
今天小編就為大家分享一篇讓webpack+vue-cil項目不再自動打開瀏覽器的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09Vue使用js-audio-recorder實現(xiàn)錄制,播放與下載音頻功能
這篇文章主要為大家詳細介紹了Vue如何使用js-audio-recorder實現(xiàn)錄制,播放與下載音頻功能,文中的示例代碼講解詳細,感興趣的小伙伴可以了解下2023-12-12Vue中的Object.defineProperty全面理解
這篇文章主要介紹了Vue中的Object.defineProperty全面理解,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-04-04Element-ui的table中使用fixed后出現(xiàn)行混亂情況的解決
這篇文章主要介紹了Element-ui的table中使用fixed后出現(xiàn)行混亂情況的解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10對Vue table 動態(tài)表格td可編輯的方法詳解
今天小編就為大家分享一篇對Vue table 動態(tài)表格td可編輯的方法詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08