Vue基礎概念有哪些

這篇文章主要介紹“Vue基礎概念有哪些”，在日常操作中，相信很多人在Vue基礎概念有哪些問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”Vue基礎概念有哪些”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

        1、 Vue.js是什么?
        Vue (讀音 /vju?/，類似于 view) 是一套用于構建用戶界面的漸進式框架，只關注于視圖層。在Vue的官網中我們可以看見，對于漸進式框架這個詞，作者是加粗表示的，按照作者的設計，Vue包含了現代前端框架所必須的內容，但是你并不需要一開始就把所有的東西都用上，這些都是可選的。
        對于Vue的解釋，推薦簡書上的一篇文章，文章地址：一句話理解Vue核心內容

        2、 使用Vue.js后與傳統的前端開發模式有何不同?
        在傳統的前端開發中，為了完成某個任務，我們需要使用 JS/Jquery 獲取到元素的DOM元素，隨后對獲取到的DOM元素進行操作。而當我們使用Vue進行前端開發后，對于DOM的所有操作全部交由Vue來處理，我們只需要關注于業務代碼的實現就可以了。

        3、 如何使用Vue.js?
        3.1、使用 script 標簽引用Vue.js（這里可以在Vue的官網上下載好js文件后使用標簽引入，也可以使用cdn的形式引入）

1

<script  src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>

        3.2、使用 Vue-cli 構建單頁應用（需要先在電腦中安裝好node.js環境才可使用）

1
2
3
4
5
6
7
8
9
10

//1、全局安裝Vue-Cli
npm install -g vue-cli
//2、進入創建項目目錄下
//3、創建使用webpack模板的Vue單頁應用，Enter后根據提示完成項目的創建
vue init webpack projectname
//4、進入項目目錄下
//5、下載項目引用的包
npm install
//6、運行項目
npm run dev

        PS：這里使用的是 vue-cli 的 2.x 版本，在最新的 vue-cli 3.x 版本中，包名已經發生了改變，你需要卸載原有的包之后重新安裝 vue-cli 才可以，同時也可以使用頁面的形式配置項目了。

1
2
3
4
5
6
7
8

//1、卸載原有的 vue-cli 版本
npm uninstall vue-cli -g
//2、安裝新版本 vue-cli
npm install -g @vue/cli
//3、創建項目
vue create projectname
//3、使用頁面創建
vue ui

        4、 MVC與MVVM
        4.1、MVC（Model-View-Controller）：是一種表現模式（UI / Presentation Pattern），它將軟件的UI部分的設計拆分成三個主要單元，分別是Model、View和Controller。
        MVC核心是控制器，它負責處理瀏覽器傳送過來的所有請求，并決定要將什么內容響應給瀏覽器。
        Model：模型，用于存儲數據的組件
        View：視圖，根據Model數據進行內容展示的組件
        Controller：控制器，接受并處理用戶指令，并返回內容

        4.2、MVVM（Model-View-ViewModel）：MVVM的核心是ViewModel，它提供了對于Model和ViewModel的雙向數據綁定，通過ViewModel連接View和Model,確保視圖與數據的一致性,而這個過程是框架自動完成的,無需手動干預。

到此，關于“Vue基礎概念有哪些”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！