一個(gè)vue頁面由哪些部分組成

今天小編給大家分享一下一個(gè)vue頁面由哪些部分組成的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。

一個(gè)vue頁面由三部分組成：1、template標(biāo)簽包裹的界面展示代碼（HTML代碼）；2、script標(biāo)簽包裹的業(yè)務(wù)實(shí)現(xiàn)代碼（js腳本代碼）；3、style標(biāo)簽包裹的界面布局代碼（css樣式代碼）。

本教程操作環(huán)境：windows7系統(tǒng)、vue2.9.6版，DELL G3電腦。

vue頁面的構(gòu)成

一個(gè)vue頁面主要分為三部分。

• <template>界面展示代碼（需要注意的是只能有一個(gè)大的div）</template>

• <script>export default {業(yè)務(wù)實(shí)現(xiàn)代碼}</script>

• <style scoped >界面布局代碼(scoped 解決了css全局污染)</style>

HTML：template 中可以使用html標(biāo)簽也有著element-ui vant-ui組件，這些組件更可視化。

js： script 中：有屬性 data  components methods mounted computed 綁定的方法，以及生命周期8個(gè)等等。

css：scss less預(yù)處理等

vue全家桶

vue-cli + vue2.0 + vuex + vue-router + axios + element-ui

vue-cli 是快速搭建vue項(xiàng)目的腳手架。

vue 2.0 是vue.js是一套構(gòu)建用戶界面的漸進(jìn)式框架。vue 在2.0版本上引入了vdom。其vdom算法是基于snabbdom算法所做的修改。

vuex  的應(yīng)用核心就是store（倉庫） ，“store” 基本上就是一個(gè)容器，它包含應(yīng)用中大部分的狀態(tài)，vuex不是單純的全局對(duì)象，他是響應(yīng)的，不能直接改變store中的狀態(tài)。需要顯示的提交

vue-router 是vue生態(tài)里面的路由工具，采用路由能輕松實(shí)現(xiàn)單頁面程序。

axios 是網(wǎng)絡(luò)請求方法。還有axios-jsonp 可以解決跨域問題。

element-ui 是一套為開發(fā)者、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于vue2.0的桌面端組件庫。

以上就是“一個(gè)vue頁面由哪些部分組成”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請關(guān)注億速云行業(yè)資訊頻道。