Vue 實戰 餓了麼 （一）

一、$mount()手動掛載

當vue例項沒有el屬性時，則該例項尚沒有掛載到某個dom中；假如需要延遲掛載，可以在之後手動呼叫vm.$mount()方法來掛載。

new vue();

二、mock資料

如果後端介面尚未開發完成，前端開發一般使用mock資料。

注意：新版的vue-cli 自動搭建的build 檔案裡沒有dev-server.js 和 dev-client.js ，因此我們要在webpack.dev.conf.js 裡配置

配置如下：

（1）複製data.json 到該專案下

（2）找到bulid目錄下 webpack.dev.conf.js 找到 const portfinder = require('portfinder')，在其下新增mock 資料

// 新增mock 資料

const express = require('express')
var apiroutes = express.router()

watchoptions: ,

res.json(),
res.json()
}),res.json()
})}

（4）設定儲存後 npm run dev 執行 訪問http://localhost:8080/api/seller 就可接收到 該路由對應的json 資料

三、關於路由 vue-router

* 直接定義路由

（1）首先定義路由

//  定義路由元件

const goods = ;
const seller = ;

（2）建立路由例項

// 建立路由例項

var router = new vuerouter(, ,]
});

路由例項方法:

router.push();  //直接新增乙個路由,表現切換路由，本質往歷史記錄裡面新增乙個

router.replace() //替換路由，不會往歷史記錄裡面新增
// router.go('goods')

（3）建立vue 例項

//  建立 vue 例項

router
})

（4）dom 渲染

seller

注意：

檢視效果時，發現動態的給當前路由 新增le乙個router-link-active的類名,所以如果需要設定當前路由樣式（比如：高亮）就可以直接在style裡設定了

* （main.js）引入路由元件

（1）引入路由檔案

import goods from './components/goods/goods'

import ratings from './components/ratings/ratings'
import seller from './components/seller/seller'

（2）建立路由例項 定義路由元件

const router = new vuerouter(,, , ]，

linkactiveclass: 'active' // 將 router-link-active 改為 active（方便樣式操作）
})

（3）建立vue例項並掛載

new vue(

})

四、axios 請求資料

（1）安裝 axios

npm install axios

import axios from 'axios'

（3）axios 請求資料（在此之前建立乙個接受資料的對sellerobj）

export default }},

created ())
}}

原文發布時間為：2023年01月19日

前端喵

餓了麼專案 一

可以上傳已有的svg圖示，生成對應的css.引入生成的css，就可以用css呼叫相應的圖示 var apiroutes express.router apiroutes.get seller function req,res apiroutes.get goods function req,res ...

餓了麼註冊餓了團 餓了麼拼團商標

程式設計yi vgdbz客棧 www.cppcns.com 6月16日 訊息 企查查app顯示，餓了麼運營主體公司拉扎斯網路科技 上海 有程式設計客棧限公司於6月8日申請註冊餓了團商標。餓了麼申請的餓了團商程式設計客棧標國際分類包含35類 www.cppcns.com廣告銷售 43類 餐飲住宿等，目...

vue的餓了麼寫作感受

1.在重複使用的元件中，要把重複使用元件的需要在資料的請求的地方設定為在富元件中，通過props船隻到子元件，這樣在重複呼叫次元件的時候既可以很好的避免元件的值的衝突 2.getdata的使用，把所有的axios請求都在getdata中使用，然後在請求的action中進行引入然後進行資料的處理 mu...