---
# System prepended metadata

title: 第二週
tags: [Vue 直播班 - 2022 冬季班]

---

---
tags: Vue 直播班 - 2022 冬季班
---

# 第二週

## 關鍵知識：

- Axios / 非同步
- **API 說明**
- This
- Vue 的 Create → Vue 的指令練習


## 主題一：非同步與 Axios

> 哪邊會用到？課程中會串接大量的 API，其中都會不斷地套用非同步與 Promise 的概念。

知識點：事件佇列

- JS 是屬於同步語言，基本上都是依序執行
- 但非同步的行為會先放在事件佇列內，等所有程式執行完後才執行

Promise

- 過去非同步可能會使用 callback 進行串接
- 非同步程式碼更有一致的結構性
- then, catch 用法說明
- 鏈接


## 主題二：課程 API 說明

> 哪邊會用到？從第二週至課程結束，都會在本課程 API 中建立、讀取、修改資料內容，並且完成一個作品。

申請：[https://vue3-course-api.hexschool.io/](https://vue3-course-api.hexschool.io/)

API 文件：[https://hexschool.github.io/vue3-courses-swaggerDoc/](https://hexschool.github.io/vue3-courses-swaggerDoc/)

MDN 上的 Cookie：[https://developer.mozilla.org/zh-CN/docs/Web/API/Document/cookie](https://developer.mozilla.org/zh-CN/docs/Web/API/Document/cookie)

axios: [https://github.com/axios/axios](https://github.com/axios/axios)

- API 運作概念
- 管理者與一般用戶的差異
- Token 與驗證
- 串接示範

## 主題三：關於 This

> 哪邊會用到？Vue Options API 是基於物件的結構進行開發，因此會使用到許多 this 來進行元件內的資料、方法運用。

#### This

- 關於 this 的概念
- this 會出現在哪？
- this 與箭頭函式

#### Vue 與 this 的關係

- Vue 與 this 的關係
- v-on 觸發 methods

## 作業說明：
- 本週作業：
    - <a href="https://rpg.hexschool.com/training/33/task?type=detail&id=323" target="_top">第二週主線任務：RESTful API 串接</a>
- 團隊任務： 
- 下週預習：
    - 指令的練習本：[https://hackmd.io/@hexschool/S1DJeKTdL/%2FRhud3_1PR9qv1RJyMfwUmA](https://hackmd.io/@hexschool/S1DJeKTdL/%2FRhud3_1PR9qv1RJyMfwUmA)
    - 指令章節影片：https://courses.hexschool.com/courses/vue-202121/lectures/43290019