---
# System prepended metadata

title: 6/2 線上 Slack 助教
tags: [Vue 直播班 - 2021 夏季班]

---

---
tags: Vue 直播班 - 2021 夏季班
---

# 6/2 線上 Slack 助教


## 今日助教輪班時間

暄雯：6/2 (三) 
回覆時間：上午 9:00 - 中午 12:00

## 發問規範

老師助教同學們好，**這是我的 Codepen**，我**原本預期**「JS 第 8 行會出現數字 8」，**但卻出現**「預期外的結果是 0」，想問下問題出在哪裡？

## 注意

1. 請各位先到 Slack 上將問題放在助教服務內的 thread，如圖
 ![](https://i.imgur.com/nHE3sOx.png)
2. 遵循以上的發問規範以便助教查看問題，不可直接貼上網址而沒有說明文字或者只提供截圖
3. 助教會依照 Slack 上的順序回覆問題
4. 以下問題區塊只能由助教自行增加
5. 助教會將回覆寫在下方問題區塊

## 問題

1. **leolee：**
助教好，這是我有問題的 [Code](https://overactive1988.github.io/HexSchool_vue_lesson2021/week04/products2.html)
在 vue_products2.js 第 399 行，我刻意將任意命名的 props 內的物件名稱，從原本的 tempProducts 更改為 anyName（HTML 93 行的部分，也一併更改為 :any-name），但卻發生了error，我原先預想任意命名的部分，即使更改了應該仍是能正常運作的，因此想了解為什麼會跟預想得不一樣
這裡是正常版本的 [Code](https://overactive1988.github.io/HexSchool_vue_lesson2021/week04/products.html)
（props 內的命名為 tempProducts 的情況）
apiPath 為 `leolee`
Vue 的檢視因為種種驗證因素，
與之前 js 相比，變得相當棘手 qq，第一次發問不知道這樣格式正不正確
> 助教回覆：
發問格式沒有問題～
Vue 在除錯的確比 JS 還困難 QQ
不過其實邏輯是一樣的哩，一樣都可以靠拆解問題來找答案。
這邊跟同學分享一下這個問題助教的思考方式：
從錯誤訊息中可以得知 title 沒有被定義，這邊可以試著去推測為什麼 title 沒有被找到？
另外，因為 title 包含在 tempProducts 裡面，那如果是只設定 tempProducts，程式會不會出現錯誤？如果一樣有錯誤，代表 tempProducts 沒有被定義。
tempProducts 沒有被定義時，需要檢查的內容有：HTML 元件的屬性及其傳遞名稱、props 的物件名稱、元件中使用的變數名稱。這幾個是否都有正確設定。
>
>同學修改 props 物件名稱後，有將 HTML 中傳遞名稱的部分調整很好哦～不過目前元件內使用的變數是 tempProducts 而不是 anyName 哩。把 HTML 第 139 行修改為 anyName 就可以囉 :D

2. **Oober：**
助教好，這是我製作第三周作業的 CodePen:https://codepen.io/xtsjrjdv/pen/wvJyaBv
我有去檢查我的 API 是有的，但是資料以及一直顯示我沒有輸入 API，麻煩助教一下！
> 助教回覆：
> 網址的部分少打了 `/api` 哦，第 31 行修改為下面這行就可以了：
> `const url = ${this.apiUrl}/api/${this.apiPath}/admin/products;`
---