lavrentiev/yii2-toastr

该包已被放弃,不再维护。没有建议的替代包。

简单的javascript toast通知

安装量: 89,152

依赖: 4

建议者: 0

安全性: 0

星标: 24

关注者: 4

分支: 10

开放问题: 6

类型:yii2-extension

2.0.2 2017-10-24 08:49 UTC

This package is auto-updated.

Last update: 2021-12-29 02:21:38 UTC


README

简单的javascript toast通知 - 用于非阻塞通知的JavaScript库。需要jQuery。目标是创建一个可定制和扩展的简单核心库。

Latest Stable Version Total Downloads Latest Unstable Version License

安装

该扩展通过Composer安装,请按照Composer的安装说明进行安装

通过Composer安装扩展,请执行以下命令

composer require --prefer-dist lavrentiev/yii2-toastr

或者 (master)

composer require --prefer-dist lavrentiev/yii2-toastr "dev-master"

或者修改composer.json中的require部分,并执行composer update

"lavrentiev/yii2-toastr": "^2.0"

或者 (master)

"lavrentiev/yii2-toastr": "dev-master"

通知 Notification::widget()

alt text

use lavrentiev\widgets\toastr\Notification;

Notification::widget([
    'type' => 'info',
    'title' => 'Toast Notifications',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'error',
    'title' => 'Toast Notifications',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'success',
    'title' => 'Toast Notifications',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'warning',
    'title' => 'Toast Notifications',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'info',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'error',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'success',
    'message' => 'Simple javascript toast notifications'
]);

Notification::widget([
    'type' => 'warning',
    'message' => 'Simple javascript toast notifications'
]);

还可以根据开发者预定义的参数设置自定义通知 Toastr by CodeSeven

alt text

Notification::widget([
    'type' => Notification::TYPE_ERROR,
    'title' => 'Toast Notifications',
    'message' => 'Simple javascript toast notifications',
    'options' => [
        "closeButton" => false,
        "debug" => false,
        "newestOnTop" => false,
        "progressBar" => false,
        "positionClass" => Notification::POSITION_TOP_RIGHT,
        "preventDuplicates" => false,
        "onclick" => null,
        "showDuration" => "300",
        "hideDuration" => "1000",
        "timeOut" => "5000",
        "extendedTimeOut" => "1000",
        "showEasing" => "swing",
        "hideEasing" => "linear",
        "showMethod" => "fadeIn",
        "hideMethod" => "fadeOut"
    ]
]);

通知 NotificationFlash::widget()

全局连接,例如在项目的布局中。

<?= \lavrentiev\widgets\toastr\NotificationFlash::widget() ?>

还可以根据开发者预定义的参数设置通知 Toastr by CodeSeven

<?= \lavrentiev\widgets\toastr\NotificationFlash::widget([
    'options' => [
        "closeButton" => true,
        "debug" => false,
        "newestOnTop" => false,
        "progressBar" => false,
        "positionClass" => \lavrentiev\widgets\toastr\NotificationFlash::POSITION_TOP_RIGHT,
        "preventDuplicates" => false,
        "onclick" => null,
        "showDuration" => "300",
        "hideDuration" => "1000",
        "timeOut" => "5000",
        "extendedTimeOut" => "1000",
        "showEasing" => "swing",
        "hideEasing" => "linear",
        "showMethod" => "fadeIn",
        "hideMethod" => "fadeOut"
    ]
]) ?>

alt text

\Yii::$app->session->setFlash('error', 'This is the message');
\Yii::$app->session->setFlash('success', 'This is the message');
\Yii::$app->session->setFlash('info', 'This is the message');
\Yii::$app->session->setFlash('warning', 'This is the message');

alt text

\Yii::$app->session->setFlash('warning', ['Error 1', 'Error 2', 'Error 3']);
\Yii::$app->session->setFlash('success', ['Error 1', 'Error 2', 'Error 3']);

可接受参数

参数 默认值 可接受值 描述
type info info, error, success, warning 通知类型
title --- --- 通知标题
message 简单的javascript toast通知 --- 通知文本
options [] 详细信息... 附加选项

可接受类型常量

TYPE_INFO = 'info'
TYPE_ERROR = 'error'
TYPE_SUCCESS = 'success'
TYPE_WARNING = 'warning'

可接受位置常量

POSITION_TOP_RIGHT = 'toast-top-right';
POSITION_TOP_LEFT = 'toast-top-left';
POSITION_TOP_CENTER = 'toast-top-center';
POSITION_TOP_FULL_WIDTH = 'toast-top-full-width';

POSITION_BOTTOM_RIGHT = 'toast-bottom-right';
POSITION_BOTTOM_LEFT = 'toast-bottom-left';
POSITION_BOTTOM_CENTER = 'toast-bottom-center';
POSITION_BOTTOM_FULL_WIDTH = 'toast-bottom-full-width';

演示

其他信息