---
# System prepended metadata

title: 七月份

---

## 2021/06/28 (一)  git建置
> 教學網站：
> https://learning.dcloud.io/#/?vid=0
github:
https://github.com/wumingxun88922/git_maxosoft_practice 
1.git 確認安裝完成
![](https://i.imgur.com/DkGQVWz.png)
2.git clone remote repo
![](https://i.imgur.com/xqw6wjY.png)
3.新增自己的資料夾
![](https://i.imgur.com/Js9Tc0N.png)
4.github
![](https://i.imgur.com/01U22aw.png)
5.新增TXT檔案/新增email/新增使用者名稱/新增資料夾名稱/git  push
![](https://i.imgur.com/ui28AwI.png)
6.連線及登入GITHUB
![](https://i.imgur.com/q25q9RV.png)
7.GITHUB 認證成功
![](https://i.imgur.com/HSEU2yo.png)
8.確認是否有新增txt檔
![](https://i.imgur.com/1cwrxK1.png)
***
## 2021/06/29(二) 第1節 Vue.js 熟悉安裝建置
***
Vue.js教學網址:https://learning.dcloud.io/#/?vid=1

              **第1節-安裝與部署**
              
CDN 製作原型或學習
![](https://i.imgur.com/rHhAhoc.png)
***
## 2021/06/30(三) 第2節 創建第一個vue應用
***
創建 顯示 hello Vue
![](https://i.imgur.com/5ry7Wid.png)

***
# 七月份
學習網站：https://vuejs.bootcss.com/guide/events.html
***
## 2021/07/01(四) 第3節 數據與方法
***
創建一個應用實例
![](https://i.imgur.com/3hjWG97.png)
***
## 2021/07/02(五) 編輯文件資料 
***

創業概念海選計畫:https://www.sbir.org.tw/dlsec/idea

檔案需到網站下載

步驟:

**1.計畫申請階段**
***
![](https://i.imgur.com/u8nFQNi.png)
![](https://i.imgur.com/4Wj272X.png)
***
**2.計畫簽約階段(Stage1)**
***
目前尚無資料
***
**3.計畫簽約階段(Stage2)**
***
![](https://i.imgur.com/yELH3aA.png)
![](https://i.imgur.com/Y0iFTKk.png)
***
**4.計畫執行階段**
***
![](https://i.imgur.com/AHhNl05.png)
**6.計畫結案階段**
***
![](https://i.imgur.com/1NDaadj.png)
***
**7.各階段報告相關附件**
***
![](https://i.imgur.com/Yatdyv2.png)
**8.計畫簽約暨會計管考說明**
![](https://i.imgur.com/erH5SkL.png)
***

因應COVID-19創新研發計畫

網址:https://www.sbir.org.tw/dlsec/covid19
步驟:
***
**1.計畫申請階段**
![](https://i.imgur.com/xNmFzWy.png)
***
**2.計畫簽約階段**
***
![](https://i.imgur.com/rW9tovT.png)
***
**2-1.計畫簽約階段**
***
![](https://i.imgur.com/jSQsghs.png)
***
**3.計畫執行階段**
![](https://i.imgur.com/YSj7qg5.png)
***
**4.計畫結案階段**
***
![](https://i.imgur.com/eQ5y2E0.png)
***
**5.各階段報告相關附件**
***
![](https://i.imgur.com/LTxQIQe.png)
***
**5-1.各階段報告相關附件**
![](https://i.imgur.com/ppvtqHT.png)
***
**6.計畫簽約暨會計管考說明**
***
![](https://i.imgur.com/viqjiRa.png)
***
## 2021/07/05(一) 
學習網站：https://ithelp.ithome.com.tw/articles/10223406
## 2021/07/06(二) 第4節 生命週期
網址：
![](https://i.imgur.com/TRV2KBx.png)
## 2021/07/07(三) 第5節 模板語法-插值
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0707%20%E7%AC%AC5%E7%AF%80%20%E6%A8%A1%E6%9D%BF%E8%AA%9E%E6%B3%95-%E6%8F%92%E5%80%BC.html
![](https://i.imgur.com/pc1iiv9.png)
## 2021/07/08(四) 第6節 模板語法-指令
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0708%20%E7%AC%AC6%E7%AF%80%20%E6%A8%A1%E6%9D%BF%E8%AA%9E%E6%B3%95-%E6%8C%87%E4%BB%A4.html

![](https://i.imgur.com/lgRnXpS.png)
![](https://i.imgur.com/G2kwxDx.png)
![](https://i.imgur.com/D9CTz4Q.png)
## 2021/07/09(五) 第7節 class與style綁定
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0709%20%E7%AC%AC7%E7%AF%80%20class%E8%88%87style%E7%B6%81%E5%AE%9A.html
![](https://i.imgur.com/ewSvvey.png)
![](https://i.imgur.com/0mEa5eL.png)
## 2021/07/12(一) 第8節 條件渲染
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0712%20%E7%AC%AC8%E7%AF%80%20%E6%A2%9D%E4%BB%B6%E6%B8%B2%E6%9F%93.html
![](https://i.imgur.com/cdeED7C.png)
![](https://i.imgur.com/7aM9zeP.png)
## 2021/07/13(二) 第9節 列表渲染
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0713%20%E7%AC%AC9%E7%AF%80%20%E5%88%97%E8%A1%A8%E6%B8%B2%E6%9F%93.html
![](https://i.imgur.com/pVyvyKa.png)
![](https://i.imgur.com/d0fvF3N.png)
## 2021/07/14(三) 第10節 事件渲染
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0714%20%E7%AC%AC10%E7%AF%80%20%E4%BA%8B%E4%BB%B6%E6%B8%B2%E6%9F%93.html
![](https://i.imgur.com/y1ccXwZ.png)
![](https://i.imgur.com/6Ts6tvv.png)
## 2021/07/15(四) 第11節 表單輸入綁定
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0715%20%E7%AC%AC11%E7%AF%80%20%E8%A1%A8%E5%96%AE%E8%BC%B8%E5%85%A5%E7%B6%81%E5%AE%9A.html
![](https://i.imgur.com/mVWQSqf.png)
![](https://i.imgur.com/wmTp1YL.png)
![](https://i.imgur.com/985bABo.png)
## 2021/07/16(五) 第12節 組件基礎
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0716%20%E7%AC%AC12%E7%AF%80%20%E7%B5%84%E4%BB%B6%E5%9F%BA%E7%A4%8E.html
![](https://i.imgur.com/lJ5zqsC.png)
![](https://i.imgur.com/6RvDBJo.png)
## 2021/07/19(一) 第13節 組件註冊
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0719%20%E7%AC%AC13%E7%AF%80%20%E7%B5%84%E4%BB%B6%E8%A8%BB%E5%86%8A.html
![](https://i.imgur.com/qWHpUOJ.png)
![](https://i.imgur.com/quuB0bi.png)
![](https://i.imgur.com/uU38V0Z.png)
## 2021/07/20(二)第14節 監聽事件
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0720%20%E7%AC%AC14%E7%AF%80%20%E7%9B%A3%E8%81%BD%E4%BA%8B%E4%BB%B6.html
![](https://i.imgur.com/L57vgfw.png)
![](https://i.imgur.com/DMQ05Pf.png)
## 2021/07/21(三)第15節 單文件組件
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0721%20%E7%AC%AC15%E7%AF%80%20%E4%BA%8B%E4%BB%B6%E8%99%95%E7%90%86%E6%96%B9%E6%B3%95.html
![](https://i.imgur.com/eE0Ngau.png)
![](https://i.imgur.com/Qf4KOuc.png)
![](https://i.imgur.com/e12nrIa.png)
## 2021/07/22(四) 第16節 內聯處理器中的方法
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0722%20%E7%AC%AC16%E7%AF%80%20%E5%85%A7%E8%81%AF%E8%99%95%E7%90%86%E5%99%A8%E4%B8%AD%E7%9A%84%E6%96%B9%E6%B3%95.html
![](https://i.imgur.com/yvnnRqa.png)
![](https://i.imgur.com/s1RQwCg.png)
## 2021/07/22(四) 第17節 內聯處理器中的方法1
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E4%B8%83%E6%9C%88%E4%BB%BD/0722%20%E7%AC%AC17%E7%AF%80%20%E5%85%A7%E8%81%AF%E8%99%95%E7%90%86%E5%99%A8%E4%B8%AD%E7%9A%84%E6%96%B9%E6%B3%951.html
![](https://i.imgur.com/gTCsHBa.png)
![](https://i.imgur.com/XoSuOR2.png)
## 2021/07/23(五) 第18節 事件修飾符
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E4%B8%83%E6%9C%88%E4%BB%BD/0723%20%E7%AC%AC18%E7%AF%80%20%E4%BA%8B%E4%BB%B6%E4%BF%AE%E9%A3%BE%E7%AC%A6.html
![](https://i.imgur.com/C4UrxVp.png)
![](https://i.imgur.com/xFnHttD.png)
## 2021/07/26(一) 第19節 按鍵修飾符
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0726%20%E7%AC%AC19%E7%AF%80%20%E6%8C%89%E9%8D%B5%E4%BF%AE%E9%A3%BE%E7%AC%A6.html
![](https://i.imgur.com/shGL8Ko.png)
![](https://i.imgur.com/mh0cjjM.png)

## 2021/07/27(二) 第20節 系統修飾鍵
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/0727%20%E7%AC%AC20%E7%AF%80%20%E7%B3%BB%E7%B5%B1%E4%BF%AE%E9%A3%BE%E9%8D%B5.html
![](https://i.imgur.com/XgUBkji.png)
![](https://i.imgur.com/GiwOWd4.png)
![](https://i.imgur.com/AfwWZub.png)
## 2021/07/28(三) 第21節 表單輸入綁定 
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E4%B8%83%E6%9C%88%E4%BB%BD/0728%20%E7%AC%AC21%E7%AF%80%20%E8%A1%A8%E5%96%AE%E8%BC%B8%E5%85%A5%E7%B6%81%E5%AE%9A%20%20.html
![](https://i.imgur.com/kEzLcI3.png)
![](https://i.imgur.com/uFeL6m5.png)
## 2021/07/29(四) 第22節 文本
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E4%B8%83%E6%9C%88%E4%BB%BD/0729%20%E7%AC%AC22%E7%AF%80%20%E6%96%87%E6%9C%AC.html
![](https://i.imgur.com/3WUgfMZ.png)
![](https://i.imgur.com/DnSWPls.png)


## 2021/07/30(五) 第23節 多行文字
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E4%B8%83%E6%9C%88%E4%BB%BD/0730%20%E7%AC%AC23%E7%AF%80%20%E5%A4%9A%E8%A1%8C%E6%96%87%E5%AD%97.html
![](https://i.imgur.com/o3korph.png)
![](https://i.imgur.com/BfrtfDn.png)

***
# 八月份
***
## 學習網站：
網址：https://kuro.tw/posts/2018/08/22/VueJS-%E5%85%83%E4%BB%B6-Component-%E4%B9%8B%E9%96%93%E8%B3%87%E6%96%99%E5%82%B3%E9%81%9E%E7%9A%84%E6%96%B9%E5%BC%8F/
https://vuejs.org/v2/guide/forms.html#Multiline-text
## 2021/08/02(一) 第24節 複選框
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0802%20%E7%AC%AC24%E7%AF%80%20%E8%A4%87%E9%81%B8%E6%A1%86.html
![](https://i.imgur.com/PWPBNyZ.png)
![](https://i.imgur.com/kG4x58c.png)
![](https://i.imgur.com/NxuMDXv.png)

## 2021/08/03(二) 第25節 多個複選框
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0803%20%E7%AC%AC25%E7%AF%80%20%E5%A4%9A%E5%80%8B%E8%A4%87%E9%81%B8%E6%A1%86.html
![](https://i.imgur.com/9Piskpj.png)
![](https://i.imgur.com/C2LsyuM.png)

## 2021/08/04(三) 第26節 選擇框
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0804%20%E7%AC%AC26%E7%AF%80%20%E9%81%B8%E6%93%87%E6%A1%86.html
![](https://i.imgur.com/tKsHO4z.png)
![](https://i.imgur.com/2v3ttYM.png)

## 2021/08/05(四) 第27節 條列選擇框
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0805%20%E7%AC%AC27%E7%AF%80%20%E6%A2%9D%E5%88%97%E9%81%B8%E6%93%87%E6%A1%86.html
![](https://i.imgur.com/0sXd3Z8.png)
![](https://i.imgur.com/IIW3131.png)
![](https://i.imgur.com/DaR3oB0.png)

## 2021/08/06(五) 第28節 多選擇框
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0806%20%E7%AC%AC28%E7%AF%80%20%E5%A4%9A%E9%81%B8%E6%93%87%E6%A1%86.html
![](https://i.imgur.com/e31LoyZ.png)
![](https://i.imgur.com/DbwX2lr.png)

## 2021/08/09(一) 第29節 選擇框-呈現v-for函式
## 學習網站：https://vuejs.org/v2/guide/forms.html#Radio
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0809%20%E7%AC%AC29%E7%AF%80%20%E9%81%B8%E6%93%87%E6%A1%86-%E5%91%88%E7%8F%BEv-for%E5%87%BD%E5%BC%8F.html
![](https://i.imgur.com/cLoVwYN.png)
![](https://i.imgur.com/trQZlgz.png)
## 2021/08/10(二) 第30節 值綁定
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0810%20%E7%AC%AC30%E7%AF%80%20%E5%80%BC%E7%B6%81%E5%AE%9A.html
![](https://i.imgur.com/yEo7gWz.png)
![](https://i.imgur.com/aaSIhd4.png)
## 2021/08/11(三) 第31節 複選框 
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0811%20%E7%AC%AC31%E7%AF%80%20%E8%A4%87%E9%81%B8%E6%A1%86%20.html
![](https://i.imgur.com/KMDVfEn.png)
![](https://i.imgur.com/h4BayWP.png)
![](https://i.imgur.com/uWyHT6c.png)

## 2021/08/12(四) 第32節 基本示例
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0812%20%E7%AC%AC32%E7%AF%80%20%E5%9F%BA%E6%9C%AC%E7%A4%BA%E4%BE%8B.html
![](https://i.imgur.com/3qDLzBX.png)
![](https://i.imgur.com/WGqzNRH.png)
## 2021/08/13(五) 第33節 多重組件
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0813%20%E7%AC%AC33%E7%AF%80%20%E5%A4%9A%E9%87%8D%E7%B5%84%E4%BB%B6.html
![](https://i.imgur.com/lLe1Bgw.png)
![](https://i.imgur.com/h37mDb2.png)
## 2021/08/16(一) 第34節 同步組件
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0816%20%E7%AC%AC34%E7%AF%80%20%E5%90%8C%E6%AD%A5%E7%B5%84%E4%BB%B6.html
![](https://i.imgur.com/qeNq32f.png)
![](https://i.imgur.com/FFOD5UT.png)
## 2021/08/17(二) 第35節 組織組件
學習網站：https://vuejs.org/v2/guide/components.html#Reusing-Components
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0817%20%E7%AC%AC35%E7%AF%80%20%E7%B5%84%E7%B9%94%E7%B5%84%E4%BB%B6.html
![](https://i.imgur.com/T5iw2OT.png)
![](https://i.imgur.com/mHgrxeb.png)

## 2021/08/18(三) 第36節 總計按鈕元件
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0818%20%E7%AC%AC36%E7%AF%80%20%E7%B8%BD%E8%A8%88%E6%8C%89%E9%88%95%E5%85%83%E4%BB%B6.html
![](https://i.imgur.com/GKdf7Dl.png)
![](https://i.imgur.com/vPDaGr9.png)
![](https://i.imgur.com/I2OGzez.png)
## 2021/08/19(四) 第37節 幣值轉換器
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0819%20%E7%AC%AC37%E7%AF%80%20%E5%B9%A3%E5%80%BC%E8%BD%89%E6%8F%9B%E5%99%A8.html
![](https://i.imgur.com/pjUGd0u.png)
![](https://i.imgur.com/IhLUGRi.png)
![](https://i.imgur.com/OTXIjRp.png)
## 2021/08/20(五) 第38節 使用 props 將數據傳遞給子組件
網址：
http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0820%20%E7%AC%AC38%E7%AF%80%20%E4%BD%BF%E7%94%A8%20props%20%E5%B0%87%E6%95%B8%E6%93%9A%E5%82%B3%E9%81%9E%E7%B5%A6%E5%AD%90%E7%B5%84%E4%BB%B6%20.html
![](https://i.imgur.com/Eru81fy.png)
![](https://i.imgur.com/idHyAOC.png)
## 2021/08/23(一) 0823 第39節 單個根元素
網址：http://127.0.0.1:8848/Vue.js%E7%B7%B4%E7%BF%92/%E5%85%AB%E6%9C%88%E4%BB%BD/0823%20%E7%AC%AC39%E7%AF%80%20%E5%96%AE%E5%80%8B%E6%A0%B9%E5%85%83%E7%B4%A0.html
![](https://i.imgur.com/vJX6rIz.png)
![](https://i.imgur.com/9BuLzSP.png)
