kessam/toastr

toastr.js 为 Laravel 清除通知

V1.2 2024-03-04 00:26 UTC

This package is auto-updated.

Last update: 2024-09-04 01:39:29 UTC


README

👀 此包帮助您向 Laravel 项目添加 toastr.js 通知。

Latest Stable Version Latest Unstable Version Total Downloads License

toastr

安装

您可以使用 composer 安装此包

composer require Kessam/toastr

使用

此包的使用非常简单直接,仅需要一步即可使用

在您的控制器中使用 toastr() 辅助函数来设置通知,包括信息、成功、警告或错误

// Display an error toast with no title
toastr()->error('Oops! Something went wrong!');

例如

<?php

namespace App\Http\Controllers;

use App\Post;
use App\Http\Requests\PostRequest;
use Illuminate\Database\Eloquent\Model;

class PostController extends Controller
{
    public function store(PostRequest $request)
    {
        $post = Post::create($request->only(['title', 'body']));

        if ($post instanceof Model) {
            toastr()->success('Data has been saved successfully!');

            return redirect()->route('posts.index');
        }

        toastr()->error('An error has occurred please try again later.');

        return back();
    }
}

其他选项

// Set a warning toast, with no title
toastr()->warning('Are you sure you want to proceed ?');

// Set a success toast, with a title
toastr()->success('Data has been saved successfully!', 'Congrats');

// Set an error toast, with a title
toastr()->error('Oops! Something went wrong!', 'Oops!');

// Override global config options from 'config/toastr.php'
toastr()->success('Data has been saved successfully!', 'Congrats', ['timeOut' => 5000]);

其他 API 方法

您还可以使用方法链将多个消息链接在一起

toastr()
    ->info('Welcome back')
    ->success('Data has been saved successfully!')
    ->warning('Are you sure you want to proceed ?');

您可以使用 toastr('') 代替 toastr()->success()

function toastr(string $message = null, string $type = 'success', string $title = '', array $options = []);

所以

  • toastr($message) 等同于 toastr()->success($message)
  • toastr($message, 'info') 等同于 toastr()->info($message)
  • toastr($message, 'warning') 等同于 toastr()->warning($message)
  • toastr($message, 'error') 等同于 toastr()->error($message)

配置

作为可选操作,如果您想修改默认配置,可以发布配置文件

php artisan vendor:publish --provider="Kessam\Toastr\ToastrServiceProvider"
// config/toastr.php
<?php

return [

    /*
    |--------------------------------------------------------------------------
    | Toastr options
    |--------------------------------------------------------------------------
    |
    | Here you can specify the options that will be passed to the toastr.js
    | library. For a full list of options, visit the documentation.
    |
    */
    
    'options' => [
        'closeButton'       => true,
        'closeClass'        => 'toast-close-button',
        'closeDuration'     => 300,
        'closeEasing'       => 'swing',
        'closeHtml'         => '<button><i class="icon-off"></i></button>',
        'closeMethod'       => 'fadeOut',
        'closeOnHover'      => true,
        'containerId'       => 'toast-container',
        'debug'             => false,
        'escapeHtml'        => false,
        'extendedTimeOut'   => 10000,
        'hideDuration'      => 1000,
        'hideEasing'        => 'linear',
        'hideMethod'        => 'fadeOut',
        'iconClass'         => 'toast-info',
        'iconClasses'       => [
            'error'   => 'toast-error',
            'info'    => 'toast-info',
            'success' => 'toast-success',
            'warning' => 'toast-warning',
        ],
        'messageClass'      => 'toast-message',
        'newestOnTop'       => false,
        'onHidden'          => null,
        'onShown'           => null,
        'positionClass'     => 'toast-top-right',
        'preventDuplicates' => true,
        'progressBar'       => true,
        'progressClass'     => 'toast-progress',
        'rtl'               => false,
        'showDuration'      => 300,
        'showEasing'        => 'swing',
        'showMethod'        => 'fadeIn',
        'tapToDismiss'      => true,
        'target'            => 'body',
        'timeOut'           => 5000,
        'titleClass'        => 'toast-title',
        'toastClass'        => 'toast',
    ],
];

有关可用选项的列表,请参阅 toastr.js 的文档

致谢

许可证

MIT