專案地址

learn-zhihu

本專案是知乎日報的學習筆記，原專案可以點選這裡檢視

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report
複製程式碼

For a detailed explanation on how things work, check out the guide and docs for vue-loader.

學習筆記

vuex

核心是 store（倉庫），包含著你的應用中大部分的狀態 (state)

• Vuex 的狀態儲存是響應式的。當 Vue 元件從 store 中讀取狀態的時候，若 store 中的狀態發生變化，那麼相應的元件也會相應地得到高效更新
• 改變 store 中的狀態的唯一途徑就是顯式地提交 (commit) mutation

Vuex 使用單一狀態樹——是的，用一個物件就包含了全部的應用層級狀態

mapState——解決的問題：當一個元件需要獲取多個狀態時候，將這些狀態都宣告為計算屬性會有些重複和冗餘

import時如何正確使用花括號'{ }'

假如有一個B.js，想要通過import語法引用模組`A.js：

B如何使用取決於當A.js如何匯出

情形一：A使用預設匯出

1. // A.js
2. export default

B 引用：

1. // B.js
2. import A from './A'
3. import MyA from './A'
4. import Something from './A'

情形二：A使用命名匯出

export const A = 42

B引用：

// B.js import { A } from './A' // 正確，因為A.js中有命名為A的export

import { myA } from './A' // 錯誤！因為A.js中沒有命名為myA的export import { Something } from './A' // 錯誤！因為A.js中沒有命名為Something的export

npm install、npm install --save的區別

相同點：會把X包安裝到node_modules目錄中

不同點：

• npm install XXX，不會修改package.json，而 -- save 會在package.json的dependencies屬性下新增X

computed 計算屬性

computed 計算屬性：computed 的作用主要是對原資料進行改造輸出。改造輸出：包括格式的編輯，大小寫轉換，順序重排，新增符號……。這樣可以不汙染資料來源。

計算屬性會依賴於使用它的data屬性，只要是依賴的data屬性值有變動，則自定義重新呼叫計算屬性執行一次

計算屬性的值是直接從快取中獲取，而不是重新編譯執行一次，因而其效能要高一些

計算屬性預設只有getter，不過在需要時你也可以提供一個setter

專案地址