README

此包允许您通过 Laravel Livewire 组件动态显示 toast 通知。Toast 通知由 Alpine JS 驱动，显示无延迟。

文档

Livewire Toasts

要求

AlpineJS 版本 3.0 或更高

安装

您可以通过 composer 安装此包

composer require voltageek/livewire-toasts-flowbite

将 x-voltageek-livewire-toasts 组件添加到您的应用布局视图

<body>
  <!-- body here -->
  
  <x-voltageek-livewire-toasts-flowbite />
</body>

默认情况下，toast 使用 TailwindCSS 进行样式化。要自动发现必要的类，请发布 toast 视图或将包视图位置添加到您的 tailwind.config.js 文件中

module.exports = {
    content: [
        './vendor/voltageek/**/views/**/*.blade.php',
    ],

使用

Livewire 组件设置

将 Toastable 特性添加到您的 Livewire 组件

<?php

namespace App\Http\Livewire;

use voltageek\LivewireToastsFlowbite\Traits\Toastable;
use Livewire\Component;

class SavePost extends Component
{
    use Toastable;

    //component code
}

显示 Toast

显示 toast，提供一个消息给以下四种方法之一：toastSuccess、toastWarning、toastDanger、toastInfo

public function savePost()
{
    $this->toastSuccess('Post has been successfully saved!');

    $this->toastWarning('You have reached the daily post limit!');

    $this->toastDanger('Post has not been saved!');

    $this->toastInfo('A confirmation email has been sent');
}

发布资产

自定义视图

默认情况下，toast 视图文件使用 TailwindCSS，但您可以发布并更改 toast 在您的网站上的外观。

php artisan vendor:publish --tag=voltageek-livewire-toasts-flowbite:views

现在编辑视图文件 resources/views/vendor/components/voltageek/livewire-toasts-flowbite/components/toasts.blade.php。包将使用此视图来渲染组件。

电压ek / livewire-toasts-flowbite

维护者

详细信息

README

文档

要求

安装

使用

Livewire 组件设置

显示 Toast

发布资产

自定义视图