gw1nblayd / livewire-gtoaster
为您的 Laravel Livewire 应用程序提供 Toasters
0.1.0
2024-07-17 09:28 UTC
Requires
- php: ^8.1|^8.2|^8.3
- livewire/livewire: ^3.0|dev-main
Requires (Dev)
- orchestra/testbench: ^9.0
- phpunit/phpunit: ^9.0|^10.0|^11.0
README
Livewire G-Toaster
为您的 Laravel Livewire 应用程序提供简约的 Toasters
版本兼容性
安装
步骤 1
composer require gw1nblayd/livewire-gtoaster
步骤 2
转到 resources/js/app.js
并添加以下行
import GToaster from '../../vendor/gw1nblayd/livewire-gtoaster/src/resource/js/GToaster.js'; // All parameters are optional GToaster.setParams({ // Can be 'top-right', 'top-left', 'bottom-right', 'bottom-left' position: 'bottom-right', // Time in milliseconds timer: 3000, // Can be 'none', 'fade' animation: 'none', // Can be 'flat', 'blank' style: 'flat', // Can be 'dark', 'light' theme: 'dark', // Show icons in toasts showIcons: true, });
步骤 3
将 @gtoast
指令添加到您的主布局文件。
示例: resources/views/layouts/app.blade.php
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>G-Toaster</title> </head> <body> @gtoast </body> </html>
如何使用?
在您的 Livewire 组件中
<?php declare(strict_types=1); namespace App\Livewire; use Gw1nblayd\GToaster\Livewire\Traits\GToaster; use Illuminate\View\View; use Livewire\Component; class TestComponent extends Component { use GToaster; public function submit(): void { $this->toastSuccess('All is good'); $this->toastError('Something went wrong'); $this->toastInfo('Just an info message'); $this->toastWarning('Be careful!'); } }
示例
许可证
MIT 许可证 (MIT)。请参阅许可证文件获取更多信息。