專案啟動
1.node.js配置安裝
2.vue-cli腳手架安裝
3.了解webpack,之後會通過package.json安裝資源。
4.製作iconmoon.com製作字型圖示檔案,匯入resource檔案,了解專案結構
5.mock資料
因為vue2取消了dev-client.js和dev-server.js,替換成webpack-dev-conf.js。因此在這裡踩下了vue2的第乙個大坑。
正確的mock姿勢:
//第一步,在const portfinder = //require(『portfinder』)後新增
const express = require('express')
var apiroutes = express.router()
//第二步找到devserver,在裡面新增乙個before()
res.json()//介面返回json資料,上面配置的資料seller就賦值給data請求後呼叫
}),res.json()
}),res.json()
})}
完成這一步呈現的效果就是能通過localhost:8080/api/goods等url訪問到相應頁面。
到此為止, 只要在cmd裡輸入npm run dev不報錯,並且能夠在瀏覽器上訪問到相應url的介面就算大功告成了。可以進入下乙個步驟。
外部元件
import header from './components/header/header.vue';
//匯入js時不需要@,並且可以在webpackage.base.conf.js的resolve.alias配置關鍵字匯入目錄,比如'components': path.resolve(__dirname, '../src/components')
@import './common/stylus/mixin.styl'
//匯入style時需要@
vue-resource:這個外掛程式也比較簡單,注意返回必須是json.body才是object物件。
created()
});},
header元件
...tobe continue
餓了麼專案 一
可以上傳已有的svg圖示,生成對應的css.引入生成的css,就可以用css呼叫相應的圖示 var apiroutes express.router apiroutes.get seller function req,res apiroutes.get goods function req,res ...
Vue 實戰 餓了麼 (一)
一 mount 手動掛載 當vue例項沒有el屬性時,則該例項尚沒有掛載到某個dom中 假如需要延遲掛載,可以在之後手動呼叫vm.mount 方法來掛載。new vue render function x 二 mock資料 如果後端介面尚未開發完成,前端開發一般使用mock資料。注意 新版的vue ...
vue的餓了麼寫作感受
1.在重複使用的元件中,要把重複使用元件的需要在資料的請求的地方設定為在富元件中,通過props船隻到子元件,這樣在重複呼叫次元件的時候既可以很好的避免元件的值的衝突 2.getdata的使用,把所有的axios請求都在getdata中使用,然後在請求的action中進行引入然後進行資料的處理 mu...