README

描述

为您的Laravel项目提供易于使用的通知实用工具。

工作原理

LaraToaster使用Laravel Session类从您的控制器创建Flash消息。当检测到消息时，它将注入一个Buefy Toast对象，并提醒用户您的消息。

如何安装

此包要求您在Laravel项目中已安装Vue、Bulma和Buefy。

步骤 1：通过Composer

$ composer require theorythree/laratoaster

步骤 2：在您的Laravel项目中定义服务提供者和别名

此包利用了Laravel 5.5+中发现的新的自动发现功能。如果您使用的是该版本的Laravel，则可以跳过此步骤，直接进行步骤 3。

将LaraToaster服务提供者添加到config/app.php。

'providers' => [

  /*
   * Application Service Providers...
   */

  TheoryThree\LaraToaster\LaraToasterServiceProvider::class,
];

在config/app.php中定义LaraToaster别名。

'aliases' => [

  /*
   * Aliases
   */
  'Toaster' => TheoryThree\LaraToaster\LaraToasterFacade::class,
];

步骤 3. 发布插件配置文件和Vue组件文件

发布配置文件以覆盖包默认值并安装LaraToaster.vue组件。

$ php artisan vendor:publish --tag=laratoaster

此命令将生成一个配置文件config/laratoaster.php，并将安装LaraToaster Vue组件resources/assets/js/components/LaraToaster.vue。

步骤 4. 安装Buefy + Bulma

如果您尚未安装，请安装Buefy。这样做也将安装Bulma。$ yarn add buefy

步骤 5. 注册Vue组件

在resources/assets/js/app.js中注册LaraToaster Vue组件。

// import BUEFY
import Buefy from 'buefy'
// Use Buefy
Vue.use(Buefy)

// Register LaraToast Vue Component
Vue.component('laratoaster', require('./components/LaraToaster.vue').default);

// Make sure to have a New Vue instance setup
const app = new Vue({
    el: '#app'
});

步骤 6. 运行您的编译器

别忘了运行您的编译器脚本以更新您的js文件。$ yarn run dev或$ yarn run watch

用法

LaraToaster可以在您的项目中随时使用，以通知用户事件。通常在CRUD控制器中使用。LaraToaster使用Session::flash方法设置Flash消息。

1. 安装包
2. 在resources/assets/js/app.js中包含Vue.component('laratoaster', require('./components/LaraToaster.vue'));
3. 在您的Blade模板中包含{!! Toaster::toast() !!}
4. 在您的控制器中设置Toaster消息（见以下示例）

make()

String make( String $type, String $message )

描述

此方法可用于在您希望在视图加载时每次都显示警报消息的情况下。此方法不依赖于Session，因此将在页面加载时立即触发警报。

重要

此方法返回一个名为<laratoastert>的Vue组件，因此您必须确保在Blade模板中使用!!{}而不是{{ }}来括号方法，否则返回的字符串将被转义。

此外，您必须将标签放在一个实例化的Vue元素内。在我们的示例中，我们使用了一个id为#app的div。

参数

$type

String: 要显示的消息类型。接受Buefy支持的所有类名（在类型名称中不包括is-）。（选项：success、warning、danger、black、white、dark、light、info）

$message

String: 要显示的警报消息。

示例 1：即时Toast

// resources/js/app.js
// make sure the Vue component is registered
Vue.component('laratoaster', require('./components/LaraToaster.vue'));

// make sure the Vue is set to the HTML element contained in your Blade template
// In this example, we're assuming a div with an id of #app.
const app = new Vue({
    el: '#app'
});

<!-- in your Blade Template -->
<div id="app">
  {!! Toaster::make("success","Instant toast, made right in the template!") !!}
</div>  

toast()

String toast()

描述

LaraToaster 还可以用来依赖会话，这很可能是你希望在项目中设置的配置。设置分为两部分。(1) 在你的 Blade 模板中调用 toast() 方法（这作为 <laratoaster> 元素将被注入到模板中的占位符）和 (2) 在你的控制器中使用许多方法调用之一。

下面，我们使用 success() 方法，因为我们都是乐观主义者。

重要

此方法返回一个名为<laratoastert>的Vue组件，因此您必须确保在Blade模板中使用!!{}而不是{{ }}来括号方法，否则返回的字符串将被转义。

此外，您必须将标签放在一个实例化的Vue元素内。在我们的示例中，我们使用了一个id为#app的div。

示例 2 - 标准吐司设置

// resources/js/app.js
// make sure the Vue component is registered
Vue.component('laratoaster', require('./components/LaraToaster.vue'));

// make sure the Vue is set to the HTML element contained in your Blade template
// In this example, we're assuming a div with an id of #app.
const app = new Vue({
    el: '#app'
});

<!-- in your Blade Template -->
<div id="app">
  {!! Toaster::toast() !!}
</div>  

<?php

// controller example

namespace App\Http\Controllers;

use Toaster; // (1) include Toaster
use Session;
use Illuminate\Http\Request;

class ItemController extends Controller
{

  // ...

  public function store(Request $request)
  {

    // your store() method code

    // (2) Call Toaster
    Toaster::success("Your item was saved.");
    return redirect()->route('items.show',$item->id);

  }

}

success(), warning(), danger()

String [success, warning, danger]( String $message )

描述

这些方法可以在你的控制器文件中使用，以设置你希望触发的警报消息的类型。在所有情况下，都会设置一个包含你提供的消息的会话 Flash 消息。

重要

不要忘记在你的 Blade 模板中包含 {!! Toaster::toast() !!}，在实例化的 Vue 元素内。

参数

$message

String: 要显示的警报消息。

示例 3：设置你的吐司消息

<!-- in your Blade Template -->
<div id="app">
  {!! Toaster::toast() !!}
</div>  

<?php

/*
 Somewhere in your code probably a
 store(), update(), or destroy() method.
*/

Toaster::success("Success feels good!");
Toaster::warning("I got bad feeling about this.");
Toaster::danger("I imagined that working out differently.");

/*
 You can also use any of the other named functions
 that correspond with the Bulma status class names.
*/

Toaster::white("I don't see the world in black and white.");
Toaster::black("Who turned out the lights?");
Toaster::light("I probably should be used on a dark background.");
Toaster::dark("I probably should be used on a light background.");
Toaster::info("I'm cool either way.");

变更日志

请参阅 CHANGELOG 了解最近更改的详细信息。

贡献

所有贡献者都欢迎。如果你想为此包做出贡献，请随时提交拉取请求、提交问题或请求功能。

请参阅我们的 CONTRIBUTING 和 CODE_OF_CONDUCT 了解更多详细信息。

鸣谢

• Dan Merfeld - 作者和维护者。

联系

想要联系讨论这个包，或者你希望我们构建的另一个包？请随时通过发送电子邮件到 dan@theorythree.com 联系此包的维护者，在 Twitter 上关注或 @ me @dmerfeld。我真的很想听到你的声音。真诚的。

许可证

MIT 许可证（MIT）。请参阅 许可证文件 了解更多详细信息。