marc-coll/laravel-trix

由 Rails 的 ActionText 启发,为 Laravel 定制的 trix 编辑器

3.1 2020-09-24 09:41 UTC

This package is auto-updated.

Last update: 2024-09-24 18:23:59 UTC


README

Releases Build Status StyleCI Code Quality License Downloads

将可配置的Basecamp Trix 编辑器集成到您的 Laravel 应用中

Rails Action Text启发

安装

您可以通过 composer 安装此包

composer require te7a-houdini/laravel-trix

然后发布配置和迁移

php artisan vendor:publish --provider="Te7aHoudini\LaravelTrix\LaravelTrixServiceProvider"

迁移发布后,运行迁移以创建所需的表

php artisan migrate

然后在 HTML 的 head 标签中添加 @trixassets 指令

<html>
    <head>
        @trixassets
    </head>
</html>

使用

假设我们有一个 Post 模型 并想添加 trix 编辑器。

使用 @trix($model, $field, $config = [])

您可以在任何视图中使用 @trix 指令来渲染 trix 编辑器。

<html>
    <head>
        @trixassets
    </head>

    <body>
        <!-- notice that content field isn't presented in Post model -->
        @trix(\App\Post::class, 'content')
    </body>
</html>

存储富文本字段

现在让我们尝试在点击提交按钮时存储 content 富文本字段。

<html>
    <head>
        @trixassets
    </head>

    <body>
        <form method="POST" action="{{ route('posts.store') }}">
            @csrf
            @trix(\App\Post::class, 'content')
            <input type="submit">
        </form>    
    </body>
</html>

首先将 HasTrixRichText 特性添加到您的模型中

namespace App;

use Illuminate\Database\Eloquent\Model;
use Te7aHoudini\LaravelTrix\Traits\HasTrixRichText;

class Post extends Model
{
    use HasTrixRichText;
    
    protected $guarded = [];
}

然后您可以轻松地通过多种方式存储任何富文本字段

Post::create(request()->all());
 
//storing must follow this convention (model lowered class name)-trixFields
Post::create([
    'post-trixFields' => request('post-trixFields'),
]);

为现有模型渲染 Trix

有多种方法可以渲染现有模型的 Trix

<!-- inside view blade file -->

@trix($post, 'content')

{!! $post->trix('content') !!} //must use HasTrixRichText trait in order for $model->trix() method work

{!! app('laravel-trix')->make($post, 'content') !!}

存储附件

当在 trix 编辑器中上传文件时,会发送一个 AJAX 请求到 laravel-trix 配置文件中的 store_attachment_action。它使用 Laravel 存储,然后根据 Basecamp Trix API 返回 url(如果上传成功)。

上传的文件将作为 pending 附件存储在 trix_attachments 表中。

一旦模型被保存,所有 pending 附件的 is_pending 列将等于 0

因此,为了使存储附件非常简单,请确保在您的模型中使用 HasTrixRichText 特性。

Post::create(request()->all());
 
//storing must follow this convention (model lowered class name)-trixFields 
//and for attachment must follow attachment-(model lowered class name)-trixFields
Post::create([
    'post-trixFields' => request('post-trixFields'),
    'attachment-post-trixFields' => request('attachment-post-trixFields')
]);

更改存储磁盘

您可以从 laravel-trix 配置文件中更改附件存储磁盘。

return [
    'storage_disk' => env('LARAVEL_TRIX_STORAGE_DISK', 'public'),

    'store_attachment_action' => Te7aHoudini\LaravelTrix\Http\Controllers\TrixAttachmentController::class . '@store',

    'destroy_attachment_action' => Te7aHoudini\LaravelTrix\Http\Controllers\TrixAttachmentController::class . '@destroy',
];

或者,如果您想为特定的富文本字段更改存储磁盘,您可以这样做

@trix($post, 'content', ['disk' => 'local'])

配置表

如果您想隐藏按钮或工具栏,您可以这样做。有关更多配置,请参阅下面的表格。

@trix($post, 'content', [ 'hideButtonIcons' => ['attach', 'bold'] ])

@trix($post, 'content', [ 'hideTools' => ['text-tools'] ])

测试

composer test

变更日志

请参阅CHANGELOG 了解最近有哪些变更。

安全

如果您发现任何安全相关的问题,请通过电子邮件ahmedabdelftah95165@gmail.com联系,而不是使用问题跟踪器。

鸣谢

许可证

MIT 许可证 (MIT)。有关更多信息,请参阅许可证文件