1： vue 註冊element元件庫

Element 介紹

Element 是餓了麼前端團隊開發的一個基於 Vue.js 的桌面端元件庫，它提供的元件非常豐富，不僅功能強大，而且簡單易用。

Element 非常的流行，大多數基於 Vue.js 開發的管理系統都會使用到它。

• 官網：https://element.eleme.io/

• GitHub 倉庫：https://github.com/ElemeFE/element

• 目前已有 44.8k 的 Star 了

匯入到專案中

1、安裝

npm i element-ui

2、在 main.js 中配置 element 元件庫

/**
 * 專案的啟動入口
 
 
*/

import Vue from 'vue'
import App from './App.vue'
import router from './router'

// 載入 element 元件庫
import ElementUI from 'element-ui'

// 載入 element 元件庫的樣式
import 'element-ui/lib/theme-chalk/index.css'

// 載入全域性樣式檔案
import './styles/index.less'

// 全域性註冊 element 元件庫
Vue.use(ElementUI)

Vue.config.productionTip 
 
= false

// 建立 Vue 根例項
// 把 router 配置到根例項中
// 通過 render 方法把 App 根元件渲染到 #app 入口節點
new Vue({
  router,
  render: h => h(App)
  // el: '#app' // 等價於 $mount('#app')
}).$mount('#app')

使用說明

用哪個元件就看哪個元件的說明文件。

複製 -> 貼上 -> try-try-see。

封裝請求模組

為了方便，我們在這裡把 axios 單獨封裝一個模組用於專案中的請求操作。

/**
 * 基於 axios 封裝的請求模組
 */
import axios from 
 
'axios'

// axios()
// axios.get()
// axios.post()

// 建立一個 axios 例項，說白了就是複製了一個 axios
// 我們通過這個例項去發請求，把需要的配置配置給這個例項來處理
const request = axios.create({
  baseURL: 'http://api-toutiao-web.itheima.net' // 最新介面地址
  
  // baseURL: 'http://ttapi.research.itcast.cn/' // 請求的基礎路徑
})

// 請求攔截器

// 響應攔截器

// 匯出請求方法
export default request

// 誰要使用誰就載入 request 模組
// import request from 'request.js'
// request.xxx
// request({
//   method: ,
//   url: ''
// })