一.環境搭建
（1）vue vue-cli環境
安裝過程：
# 全域性安裝 vue-cli
$ npm install --global vue-cli
# 建立乙個基於 webpack 模板的新專案
$ vue init webpack my-project
# 安裝依賴，走你
$ cd my-project
$ npm install
$ npm run dev
（2）nuxt 服務端壞境搭建
nuxt 相關的腳手架已經整合到了 vue-cli，同時提供 starter、express、koa、adonuxt
npm install -g vue-cli
vue init nuxt/starter
cd npm install
npm run dev
二.把整個專案clone下來，使用git clone 位址
三.vue 常用知識
1. 樣式繫結：
基礎：
active--class isactive條件判斷
常用：三元運算子 } show ,not-info都屬於class
router-link樣式切換：about，只需要為新增.router-link-active 指定樣式即可
注意事項：需要使用{}花括號，條件判斷一般通過事件
2. 列表渲染 v-for
注意：列表渲染中的 顯示過濾/排序結果 computed 和methods 的使用情況
3. 條件渲染 v-if v-show 注意二者的區別
用法：4. 過濾器：全域性過濾和區域性過濾器
應用場景：文字格式化，在vue中主要應用在}和v-bind 表示式中
語法：}
注意：函式第乙個引數總是表示式的值
例子： }
金額保留2位小數
data:function()
},filters:
}輸出：123.00
具體檢視官網：
5. 元件：
（1）建立元件
nuxt環境中建立元件很簡單，只需要在components中建立.vue檔案即可，語法和pages裡的.vue檔案一樣，引入時只需要在pages 裡的.vue檔案中import，components中註冊即可。
具體：components:
vue 單頁面環境中，基本和nuxt的方法一樣，只是import 路徑稍有不同
nuxt import child from '~/components/child.vue'
vue import child from './components/child.vue'
(2)元件的傳遞使用prop
(3）ref
ref=""乙個引用id 註冊引用資訊
第一：在普通的dom元素上使用，引用指向的就是dom元素。訪問方式this.$refs.引用id。
eg:使用的一種情況亂，獲取文字框的值
提交new vue(,
methods:}})
第二：被用來給子元件註冊引用資訊，直接訪問子元件，訪問方式this.$refs.引用id.具體訪問內容
6.過渡&動畫
7.深入響應式原理 主要講set
vue 不允許在已經建立的例項上動態新增新的根級響應式屬性。然而它可以使用 vue.set(object, key, value) 方法將響應屬性新增到巢狀的物件上：
vue.set(vm.someobject, key, value) or this.$set(this.someobject,key,value)
注意：nuxt 服務端渲染建議不使用vue.set,使用this.$set.
個人理解：就是給物件中新增需要用到的屬性但物件中木有。
8.axios 的使用
vue的基本使用總結一
2021 3 25 vue的基本使用 jquery與vue定位不一樣 jquery獲取元素完成特效 vue的定位是方便操作和控制資料完成特效vue的使用三個注意事項 1.乙個html頁面中可以存著多個vue例項物件 但是例項物件的變數名唯一 2.js所有變數和語法區分大小寫 new vue 3.建議...
vue2 0 router基本語法總結
vue基本腳手架 常用的方法 methods 方法處理 mounted dom 載入前之前執行 computed 計算屬性 components 元件註冊 filters 過濾器註冊 watch 資料監聽 不常用 data vue 將會遞迴將 data 的屬性轉換為 getter setter pr...
VUE基本使用
建立前呼叫this.currdate fun 方法 created function mounted function watch else 出勤checkbox 請假值 檢查，乙個為真，另外乙個設定為false singleout data function tmp else 1 html頁面呼叫...