Joeの小屋

Sass筆記 介紹 Sass 是 CSS 預處理器(CSS Preprocessor）的一種 預處理器是讓開發者撰寫一些類似 CSS 語法的指令，再轉為瀏覽器能懂的 CSS SASS / SCSS 檔案需編譯為 CSS 檔 Sass 支持所有現代瀏覽器，並且與 CSS3 兼容。 節省許多時間，因為減少了 CSS 的重複 SASS vs. SCSSSass 和 SCSS 是兩種不同的 Sass 語法格式 SCSS（Sassy CSS）使用.scss文件擴展名稱，使用常規的 CSS 語法和大括號來結構化代碼，需加上 {} ;。 /* .scss file */$bgcolor: blue; /* use variables */body { background-color: $bgcolor;}.container { width: 100%;} SASS（Indented Sass）使用.sass文件擴展名稱，使用縮排而不是括號，取消{} ;，它不完全符合 CSS 語法，但編寫起來更快。 此寫 ...

Laravel admin彈出視窗無法使用ajax動態載入資料解決版本"encore/laravel-admin": "^1.8", 問題在普通表單中通過ajax方式動態分頁載入選項正常，但在彈出的表單當中卻失效 解決在html()方法中加上程式碼即可解決，bootstrap 框架的問題，移除外層tabindex=-1屬性即可解決 <script> $(document).ready (function (){ $(".modal").removeAttr("tabindex"); });</script>

Laravel admin form tab表單插入html版本"encore/laravel-admin": "^1.8", 問題及需求需要在 laravel admin form tab 裡面純 HTML 顯示，如下圖所示，想要在橘色框裡直接顯示 HTML 而不是 laravel admin 表單組件的 HTML 顯示。 懶人包 創建一個新的組件，如 htmlCustom ，並繼承 Encore\Admin\Form\Field\Html 修改組件的 render 方法，以便直接返回要渲染的 HTML 而不是包含在框架中 在 app\Admin\bootstrap.php 中註冊組件 在您的代碼中使用該組件，可以是實現了 Htmlable、Renderable 或實現了 __toString() 方法的類或者是閉包，以便在表單中插入 HTML 內容。 具體示例代碼請往下查看。 自訂義組件在 Laravel admin 中有一個類似表單組件 Encore\Admin\Form\Field\Html ，程式碼如下，但他會被限縮在 ren ...

Laravel use Business Profile APIs前置條件 前往 Google API 控制台，並選取您為商家檔案使用的專案。 如要確認專案 ID，請查看「Project ID」欄。 填寫並提交存取權申請表。 我們會在審查完成後，透過電子郵件通知您。 取得核准之後，請參閱「基本設定」來為專案啟用 Business Profile API。 送出審查表單後大約兩到三天就會收到一封確認信件，回信後大概兩三天就會收到審查通過的信件，就可以開始使用Business Profile API。 更多詳細內容 創建憑證需先建立API金鑰以及OAuth 建立API金鑰API部分需先將以下與商家檔案關聯API啟用: My Business Account Management API My Business Business Calls API My Business Lodging API My Business Notifications API My Business Place Actions API My Business Account Management API ...

Laravel Intervention/image 圖片處理Intervention/image是一個對圖像處理知名的庫，我們可以用它來創建縮圖，加上浮水印，格式化大型圖檔等等。 支援常見圖像處理庫像是GD Library和imagemagick 安裝php composer.phar require intervention/image 系統要求 PHP >= 5.4 Fileinfo Extension 以及以下其一圖像library GD Library (>=2.0) … or … Imagick PHP extension (>=6.5.7) 配置發布配置指令 php artisan vendor:publish --provider="Intervention\Image\ImageServiceProviderLaravelRecent" 我們可以找到此檔案app/config/packages/intervention/image/config.php 可以選擇要使用哪一個圖像庫做驅動gd或是imagick Interve ...

Laravel在低安全性功能關閉後該如何寄信1. 登入google2. 開啟兩步驟驗證 3. 設定好後點擊這裡4. 設定應用程式及取得密鑰 5. 複製密鑰並將電子郵件密碼改成取得的密鑰MAIL_USERNAME=your_emailMAIL_PASSWORD=密鑰 6. 清除緩存$ php artisan config:clear

紀錄在Laravel中使用Line message api以及LIFFmessage api建立message api首先先到LINE Developers建立一個message api 點選新增 新增message api webhook url程式:成功建立頻道後，先下載line-bot-sdk-php composer require linecorp/line-bot-sdk 在.env檔案中新增，並將頻道資訊填入 在Basic settings找到Channel secret 在Messaging API找到Channel access token 填入LINE_BOT_CHANNEL_ACCESS_TOKEN=LINE_BOT_CHANNEL_SECRET= public function callback(Request $request){ $httpClient = new \LINE\LINEBot\HTTPClient\CurlHTTPClient(env('LINE_BOT_CHANNEL_ACCESS_TOKEN')); ...

Vue provide跨層級資料傳遞通常，當我們需要將數據從父組件傳遞給子組件時，我們會使用props，但當是一個大型組件樹時，要將父組件資料傳遞給比較深層的組件時，如果僅使用 props，我們將不得不在整個父鏈中傳遞相同的 props。 所以我們可以使用Provide(提供) / Inject(注入)來解決問題 假設我們有一個三層的組件樹，要將資料從父組件傳遞至user組件，使用Provide傳遞資料 ProvideOptions API非響應式:export default { provide:{ user:{ name: '小明', uuid: 78163 } },} 響應式:export default { data() { return { user: { name: '小明', uuid: 7 ...

Vue mixns混合元件以及擴展元件extendmixns可以使用mixns將重用有狀態邏輯的程式碼載入，如果創建的 mixin 包含一個created生命週期並且組件本身也有一個，那麼這兩個函數都會被調用。 Mixin 鉤子按照它們提供的順序被調用，並且在組件自己的鉤子之前被調用。 官方表示不再推薦在 Vue 2 中，mixin 是創建可重用組件邏輯塊的主要機制。雖然 Vue 3 繼續支持 mixin，但Composition API現在是組件之間代碼重用的首選方法。 特性 可以重複混合 生命週期可以重複觸發 同名變數，方法會被後者覆蓋 範例const mixin1 = { data() { return { name: '混合的元件1' } }, created() { console.log('混合的元件生命週期 1'); }}const mixin2 = { data() { return ...

Laravel admin 級聯選擇編輯時預設無資料問題:在創建新資料時級聯選擇是正常的，但在編輯時級聯的選擇資料不會載入。 自定義方法擴展擴展\Encore\Admin\Form\Field\Select類，新增一個檔案App\Admin\Extensions\Select.php繼承原先Select類，並新增一個函式用來trigger所選選項。 <?phpnamespace App\Admin\Extensions;use Encore\Admin\Admin;class Select extends \Encore\Admin\Form\Field\Select{ public function loadCascading(): void { $script = <<<JS if ($('{$this->getElementClassSelector()}').val() !== ''){ ...