canvas 繪製多邊形

在 hahow 買了吳哲宇老師的「動畫互動網頁特效入門(JS/CANVAS)」課程之後,就有一搭沒一搭的看,因為課程內容實在太多了,所以後來索性都跳著看。(我不是業配喔,程度不到~還沒有人要找我業配QQ)

今天一樣是心血來潮的一天,看了一下 第 5 章的第2單元,在教相對座標加上迴圈畫出重複的圖形~

反正就是有一個作業拉,說要畫出12邊形,於是就來實作一下。

閱讀更多
0

Vue3 的資料狀態管理,provide / inject、vuex、props

進入 vue3 後,多了一種跟 react 很像的資料管理方式 provide / inject,和 vuex 相同的是他可以跨組件讀寫資料,但是和 vuex 不同的是跨組件的範圍僅限於 provide 註冊那一層的子組件。

也就是說 provide 類似於 props 把資料傳入子組件,props 只能傳一層,但 provide 可以下去好幾層都可以存取,官方概念圖如下:

閱讀更多
0

回想起決定要轉職前端的那年,在房間的我陷入深深的回憶中。

又是一個要加班測試鏡頭的星期二,是一個不穿外套會太涼的四月。

畢業後,初期順利的到了一間上市公司上班,我的工作就是測試晶片溫度、用肉眼看看鏡頭有沒有自動對焦。

由於我是新來的測試工程師,理所應當每天桌上擺的滿滿都是等著我測試的鏡頭、拆解後的螺絲、散熱片,當然也還有一台不知經歷多少歲月的電腦和前輩留下的一些文件。

我的桌子是老舊的鐵做的那種辦公桌,腳不小心踢到還會發出很像打雷的那種聲音。

陳年的地板因為時間久了,導致有點凹凸不平;穿過一條條掛在櫃子上的電線,可以看到資深工程師同事正為著鏡頭一直聚焦不佳而煩惱。

閱讀更多
3+

Vue3 + i18n 初始設定

我在 vue2 已經有用過 i18n 了,怎麼搬到 vue3 就出現各種錯誤呢?

Vue3 因為 Composition API 的緣故,在引入套件上面有改一些寫法,直接從 vue2 直接搬過來是會有問題的,那就從頭開始安裝起吧!

閱讀更多
0

vue3 + ElementUI plus 按需載入

目前為止常用的框架有出到vue3的好像只有Elementui-plus,竟然這麼快就出ㄌ~太驚艷了,所以新案子就直接用起來!

對程式碼有潔癖的人,一樣可以選擇按需載入。

閱讀更多
0

vue3 + elementui-plus 表單驗證使用 ref

升級到 vue3 後,elementui 也有推出 vue3 版本叫做 elementui-plus,可以點這裡去官網了解一下,名字聽起來就很屌啊!

官網的範例有很詳細的解說使用方法,可是他竟然沒有舉例 Vue Composition API 方式的寫法,啊我不用 Composition API 我升級到 vue3 幹嘛?

下面就來寫一下上網查到的資料,看看到底要怎樣使用 v-model + ref + setup()

閱讀更多
0

vue3 使用 router

在 vue3 中使用 router 的方式跟 vue2 有點不同,主要是 Composition API 的緣故,來看看怎麼改成 vue3 吧!

也可以直接參考官網

閱讀更多
0

Vue3 自己動手寫 websocket 底層

才剛學完 vue2 的 websocket 底層,馬上又要來寫 vue3 版本了。

沒辦法,想幫客戶用比較新的技術,以免他大佬幾年都懶得翻新網站,到時候維護時苦的還是我~QQ

原本 vue2 的概念是建立一個 vue 實例,然後可以在獨立出來的api.js檔案中去存取 vuex;但現在 vue3 有了useStore這個方法,我們就可以單純寫 js 就好囉!

閱讀更多
0

vue3 transition 動畫 css class name 改了!

把舊的 vue2 的 animation 的 class 名稱直接沿用到 vue3 專案,發現動畫怎跑不起來,原來是原本的 xxx-enter 改成 xxx-enter-from 了。

閱讀更多
0