米薩克
  • 首頁
  • KBtalKing Pro
  • 關於作者
  • 鍵盤
  • 滑鼠
  • 工具
  • 網站連結
  • 首頁
  • KBtalKing Pro
  • 關於作者
  • 鍵盤
  • 滑鼠
  • 工具
  • 網站連結
米薩克

Mesak 敗家、筆記、生活

分類:

程式

code

Vue

[Vue] 那就來寫前端吧 Vue 2 extends And Vue 3

by Mesak 2022-03-02
written by Mesak

開始寫專案之前,團隊都是使用 Vue 2 寫畫面,Vue 2 要升級到 Vue 3 對我來說,最大的轉變就是 extends 了

Vue 2 用的是 Options API, Vue 3 寫的是 Composition API,寫法什麼的對還沒開始完成專案的我來說,好像沒太大差異。

但是當我實際開始寫之後,才知道我在專案上之前應用了很多 extends 用法,在 Vue 3 裡面通通失效了…

原本寫成 extends 的作法是讓每個 Component 都可以不必撰寫就有此方法,data 也可以逐一傳遞,現在通通要改成 Vue 3 的寫法。

繼續閱讀
2022-03-02 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
Vue

[Vue] 那就來寫前端吧 router permission

by Mesak 2022-03-01
written by Mesak

Vue 的本身是沒有權限的,雖然 vue router 本身建議基於 路由把資料塞到 meta 內,不過這個邏輯不方便應用我的後台管理。

目前設計的是公司內部使用的管理介面,所以是有點類似論壇的概念,每個使用者一定會有特定的權限,後端也會設計角色群組,授權給不同的使用者,所以一定會有交錯的權限設計。

目前後端採用的權限控管使用 casbin 權限控管,帶入 laravel 有的 route name,每個路由都會有獨立的 key name ,前端的路由也可以對應後端的路由,不過要確定一個明確的 keyname,根據 laravel 的 resource 定義,能夠讀取首頁的 route name 都定義為 index 。

繼續閱讀
2022-03-01 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
Vue

[Vue] 那就來寫前端吧 router ? route ?

by Mesak 2022-02-26
written by Mesak

router, route 不知從何開始,寫後端都有一個 router 來控管程式進入的方式,透過 framework 框架的路徑模式,控管每個 function 的進入點來回傳內容,細部的切分讓程式的分工執掌更明確,統一的進入點讓程式的載入更有一致性。

以往麵條式的載入寫法都被視為非主流寫法,因為統一的調用更能夠掌握整個程式的運作模式,也衍伸了像是整個程式的生命週期問題,同步與非同步調用等設計模式。

開始寫 vue之後,沒想到前端也有個路由,加上之前看過的 class 繼承,越來越覺得 前端是不是跟後端也有點像了… 不過這也不是個壞東西,既然接了就要來弄懂他。

繼續閱讀
2022-02-26 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
Vue

[Vue] 那就來寫前端吧 vuex

by Mesak 2022-02-23
written by Mesak

開始寫 vue 的時候,首先最好開始理解一下 es6 的寫法,由於我是寫 php 居多,所以當我看到 es6 有 class 還有 extends 的時候,感覺相當熟悉,好像見到了老朋友…,不過幾個同事看到我專案寫一堆 extends 都叫我去寫 React XD….

利用 vue 建立了許多 component 之後,就會發現會遇到很多傳值的問題。

在許多框架裡面,會以 全域狀態管理的模式來管理這些你需要延續傳遞下去的數值,換作原生的 JavaScript 來說,當你遇到變數作用域無法共享的時候,vuex 那就放 WINDOW 的變數一樣,大家都抓的到。

繼續閱讀
2022-02-23 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
Vue

[Vue] 那就來寫前端吧 into

by Mesak 2022-02-23
written by Mesak

許久沒更新 Blog 的文章了,因為換了工作,時間都被工作排滿了,要重新學習的東西太多了,所以荒廢了部落格的文章

熊熊忘了自己的部落格文章也有部分是偏技術的 XD。

標題直接點破這次學習的就是 Vue ,不過我學的 Vue 有點雜食,主要我主力還是放在後端,也許後面有機會,會持續更新一點 後端 Laravel 的文件。

原先的工作是利用 jQuery 來支援原有的系統,再一段一段把後端的程式碼,由麵條式代碼改成 Framework 的形狀,打算逐步進行更新,原專案用了 jQuery 純 AJAX 建立了類似 前後端分離的模式。

更新期間進行了一次改版,把前端由純 JS + jQuery 改成 ES6 的 import 檔案加上 template7 來動態載入內容,感覺有一點像是 SPA 的東西,不過離 SPA 的模樣還是差個十萬八千里。

繼續閱讀
2022-02-23 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
PHP

[筆記] FreeTDS 吃 big5 問題

by Mesak 2020-12-01
written by Mesak

工作上遇到有點複雜的配置,系統是 CentOS,但是 DB 是吃 Sybase

參照了一篇 php連線sybase(sqlanywhere)資料庫 教學,完成 ODBC的安裝,並且用 Laravel PDO 去連線 DB

但是解出來的中文字結果都是問號,google 到了一篇 ODBC Driver PHP 以及中文變成問號的處理

利用設定伺服器語系 setlocale(LC_ALL, “zh_TW.UTF-8”) 的確有抓到中文字,但是語系很明顯是錯的。

接著開始看 FreeTDS 手冊,開啟 DEBUG Log 模式抓到 原始字元從 “UTF-8” <-> “UCS-2LE” 被轉換成 UTF-8

但是我很明確知道DB 的編碼是 bug5 Big5 編碼。

繼續閱讀
2020-12-01 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
JavaScript

[JS] SELECT2 With Bootstrap4 remove button use span

by Mesak 2020-05-22
written by Mesak

應用套件遇到一點小問題

SELECT2 套件 https://github.com/select2/select2 套上樣式 Bootstrap 4 – select2-bootstrap4-theme 的時候

Select2  的版本為 4.1.0-beta.1, Select2-bootstrap4-theme 套用的 Select2 版本為 4.0.6-rc.0 目前看到最大的差異是針對 多選的取消框會有點樣式上的問題

原設計的畫面如下:

繼續閱讀
2020-05-22 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
程式

[AHK] 快速鍵搜尋檔案 Everything

by Mesak 2015-09-11
written by Mesak

最近電腦硬碟一直滿滿的紅條,堆了很多不常用的檔案 。想逐一清理之後發現,電腦佔用最空間的檔案,就是影片了。

有一些影片蒐藏也不需要太高的畫質,所以決定把電腦裡面的某些影片給轉檔縮小了。

影片檔案壓小之後遇到一些繁複的電腦操作,為了解決這些麻煩的步驟,原本我使用了  X-Mouse 來定義我滑鼠的快速鍵,按下之後呼叫 Everything 來搜尋檔案位置,但是畢竟只是簡單的工具,要寫一長串的判斷還是有點困難。

繼續閱讀
2015-09-11 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
JavaScript

[JS] jQuery Wizard

by Mesak 2014-12-23
written by Mesak

最近工作一直跟匯入的資料處理有關,弄到自己有點頭痛,其中比較頭痛的是 想要美觀的 Wizard 或是 Step 這種步驟式的plugin 大多都沒有達到我的需求

後來在網路上看到一段很簡略的 Step Wizard 應用上了一個案子,運行的很順暢。

不過還是不敷我使用,一直大量用到了之後決定寫成個 plugin 先寫個雛形方便未來修改擴增。

因為是用 Bootstrap 所以CSS範例也是跑 Bootstrap 

繼續閱讀
2014-12-23 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
程式

[VBA] EXCEL 刪除活頁簿中的所有圖片物件

by Mesak 2014-10-30
written by Mesak

工作上的關係,常常會處理一些 EXCEL 的東西,以前有買一本 快速寫巨集的書 叫做 Excel VBA 747 裡面有許多範例可以拿來直接套用…

當然也要有點 VB 的基礎才行,不然絕對會被 VB 搞混語法。

今天剛好遇到一個問題,業務手中的文件,常常存檔很慢,而且複製的時候都有不明的白邊,都刪除不掉。

我查看之後,使用 [常用] 分頁下 的 [尋找與選取] 按鈕,點選[選取窗格] ,就可以看到文件中有什麼物件

一打開來一看就是一堆的空圖片

嚇~這應該是不知道複製哪個網頁的資料貼上的邊框物件,本來以為不多,想叫他一個一個刪除,沒想到 EXCEL 點選這邊刪除會跑的很久….而且物件還塞了一千多個….

於是就寫了一隻巨集

繼續閱讀
2014-10-30 0 comment
0 FacebookTwitterPinterestTumblrRedditLINEEmail
較新文章
較舊文章

米薩克

米薩克

近期文章

  • [教學] 利用 n8n 建立 LINE 聊天機器人
  • [開箱] IROCKS K103R 熱插拔無線機械式鍵盤
  • [開箱] IROCKS-K85R 無線機械鍵盤
  • [開箱] IROCKS K75M 銀色上蓋機械式鍵盤
  • [開箱] IROCKS M31E 粉紅色光學遊戲滑鼠

彙整

  • 2025 年 6 月
  • 2025 年 3 月
  • 2024 年 4 月
  • 2023 年 10 月
  • 2023 年 9 月
  • 2023 年 8 月
  • 2023 年 2 月
  • 2023 年 1 月
  • 2022 年 11 月
  • 2022 年 7 月
  • 2022 年 5 月
  • 2022 年 3 月
  • 2022 年 2 月
  • 2021 年 12 月
  • 2021 年 11 月
  • 2021 年 10 月
  • 2021 年 7 月
  • 2021 年 6 月
  • 2021 年 4 月
  • 2021 年 3 月
  • 2021 年 2 月
  • 2020 年 12 月
  • 2020 年 11 月
  • 2020 年 10 月
  • 2020 年 9 月
  • 2020 年 8 月
  • 2020 年 7 月
  • 2020 年 6 月
  • 2020 年 5 月
  • 2020 年 4 月
  • 2020 年 3 月
  • 2020 年 2 月
  • 2020 年 1 月
  • 2019 年 12 月
  • 2019 年 11 月
  • 2019 年 10 月
  • 2019 年 9 月
  • 2019 年 8 月
  • 2019 年 7 月
  • 2019 年 6 月
  • 2019 年 5 月
  • 2019 年 4 月
  • 2019 年 3 月
  • 2019 年 2 月
  • 2019 年 1 月
  • 2018 年 12 月
  • 2018 年 11 月
  • 2018 年 9 月
  • 2018 年 8 月
  • 2018 年 7 月
  • 2018 年 6 月
  • 2018 年 5 月
  • 2018 年 4 月
  • 2018 年 3 月
  • 2018 年 2 月
  • 2018 年 1 月
  • 2017 年 12 月
  • 2017 年 11 月
  • 2017 年 10 月
  • 2017 年 9 月
  • 2017 年 8 月
  • 2017 年 6 月
  • 2017 年 4 月
  • 2017 年 3 月
  • 2017 年 2 月
  • 2017 年 1 月
  • 2016 年 12 月
  • 2016 年 11 月
  • 2016 年 10 月
  • 2016 年 9 月
  • 2016 年 8 月
  • 2016 年 7 月
  • 2016 年 6 月
  • 2016 年 5 月
  • 2016 年 4 月
  • 2016 年 3 月
  • 2016 年 1 月
  • 2015 年 12 月
  • 2015 年 11 月
  • 2015 年 10 月
  • 2015 年 9 月
  • 2015 年 8 月
  • 2015 年 7 月
  • 2015 年 6 月
  • 2015 年 5 月
  • 2015 年 4 月
  • 2015 年 3 月
  • 2015 年 2 月
  • 2015 年 1 月
  • 2014 年 12 月
  • 2014 年 11 月
  • 2014 年 10 月
  • 2014 年 9 月
  • 2014 年 8 月
  • 2014 年 7 月
  • 2014 年 6 月
  • 2014 年 5 月
  • 2014 年 4 月
  • 2014 年 3 月
  • 2014 年 2 月
  • 2014 年 1 月
  • 2013 年 12 月
  • 2013 年 11 月
  • 2013 年 9 月
  • 2013 年 8 月
  • 2013 年 7 月
  • 2013 年 6 月
  • 2013 年 5 月
  • 2013 年 4 月
  • 2013 年 3 月
  • 2013 年 2 月
  • 2013 年 1 月
  • 2012 年 12 月
  • 2012 年 11 月
  • 2012 年 10 月
  • 2012 年 9 月
  • 2012 年 8 月
  • 2012 年 7 月
  • 2012 年 6 月
  • 2012 年 5 月
  • 2012 年 4 月
  • 2012 年 3 月
  • 2012 年 2 月
  • 2012 年 1 月
  • 2011 年 12 月
  • 2011 年 11 月
  • 2011 年 10 月
  • 2011 年 9 月
  • 2011 年 8 月
  • 2011 年 7 月
  • 2011 年 6 月
  • 2011 年 5 月
  • 2011 年 4 月
  • 2011 年 3 月
  • 2011 年 2 月
  • 2010 年 11 月
  • 2010 年 10 月
  • 2010 年 9 月
  • 2010 年 7 月
  • 2010 年 4 月
  • 2010 年 3 月
  • 2009 年 11 月
  • 2008 年 12 月
  • 2008 年 10 月
  • 2008 年 9 月
  • 2008 年 8 月
  • 2008 年 7 月
  • 2008 年 6 月
  • 2008 年 4 月
  • 2008 年 3 月
  • 2008 年 2 月
  • 2008 年 1 月
  • 2007 年 12 月
  • 2007 年 11 月
  • 2007 年 10 月
  • 2007 年 9 月
  • 2007 年 8 月
  • 2007 年 7 月
  • 2007 年 6 月
  • 2007 年 5 月
  • 2007 年 4 月
  • 2007 年 3 月
  • 2007 年 2 月
  • 2007 年 1 月
  • 2006 年 12 月
  • 2006 年 11 月
  • 2006 年 10 月
  • 2006 年 9 月
  • 2006 年 8 月
  • 2006 年 7 月
  • 2006 年 6 月
  • 2006 年 5 月
  • 2006 年 3 月
  • 2006 年 2 月
  • 2006 年 1 月
  • 2005 年 12 月
  • 2005 年 11 月
  • 2005 年 10 月
  • 2005 年 9 月
  • 2005 年 8 月

分類

  • 個人配件
  • 咖啡
  • 家用主機
  • 居家
    • 家具
    • 家電
  • 工具
    • 文具
  • 影音
  • 玩具
  • 硬體
    • 3D Printer
    • 其他周邊
    • 喇叭
    • 手把
    • 手機
    • 滑鼠
    • 相機
    • 耳機
    • 鍵盤
    • 電源
  • 碎碎念念
  • 程式
    • Chrome extensions
    • JavaScript
    • PHP
    • Python
    • Vue
    • WordPress
  • 網路資訊
  • 美食
  • 軟體
  • 遊戲
  • 遊玩
  • 運動

書籤

  • 歡迎交換連結

About

Mesak

mesak

http://about.me/mesak

Contact:

Mesak Gmail

Histats:

Online:

2025 年 8 月
一二三四五六日
 123
45678910
11121314151617
18192021222324
25262728293031
« 6 月    
  • Facebook
  • Twitter

@2020- All Right Reserved. Designed and Developed by PenciDesign


Back To Top
米薩克
  • 首頁
  • KBtalKing Pro
  • 關於作者
  • 鍵盤
  • 滑鼠
  • 工具
  • 網站連結
@2020- All Right Reserved. Designed and Developed by PenciDesign