README

请参阅新的包。

EditorJS 扩展

嗨，我刚刚在构建一个后端项目，以及一个小型的 EditorJS 解析器。结果是一个有用的库。这是我的第一个包，所以请多多包涵并给予反馈。

安装

通过 composer 安装包，请运行

composer require megasteve1987/editorjs

注意：你应该查看原始包的 README.md 文件，位于GitHub

基本用法

首先使用 EditorJS 类

use Megasteve19\EditorJS\EditorJS;

然后你可以创建类的新的实例

$editorJS = new EditorJS( $json, $config );

如你所见，它的构造函数与原始 EditorJS 相同。

$json - 前端传来的 JSON 字符串。
$config - 包含配置的 JSON 字符串。

集合 CRUD

此包围绕 CRUD 操作。以下是一个示例；

$editorJS = new EditorJS($json, $config);

// Create a new block
$newBlockData = new \Megasteve19\EditorJS\Blocks\Block([
    'type' => 'header',
    'data' => [
        'text' => 'Hello World',
        'level' => 1
    ]
]);

// Push the new block to the collection
$editorJS->collection->insert($newBlock);

或者通过 ID 查找块并访问它的某些数据

echo $editorJS->collection->find($id)->find('text');

以下是集合具有的所有函数

all($type) - 返回所有块。你可以提供你想要获取的块类型，但这不是必须的。
find($id) - 通过 ID 返回块。
insert($block) - 将块插入到集合中。你可以传递一个块或一系列块。
update($block) - 更新集合中的块。你可以传递一个块或一系列块。
delete($block) - 从集合中删除块。你可以传递一个块或一系列块。
count() - 返回块的计数。
clear() - 清除集合。
toArray() - 将集合作为数组返回。
toHTML($templatesPath) - 将集合作为 HTML 返回。

有关 HTML 模板的信息，请参阅文件末尾。

块 CRUD

如果我们有要存储的数据，那么我们应该使用一些 CRUD 方法，对吧？块的 CRUD 几乎与集合相同。以下是一个示例；

// Find a block
$block = $editorJS->collection->find($id);

// Update block
$block->insert('alt', 'alt text');
$block->update('file.url', 'http://example.com/image.jpg');

// Update collection
$editorJS->collection->update($block);

如你所见，我们通过点符号访问数据。所以我希望你已经明白了。以下是块具有的所有方法列表

getId() - 返回块 ID。
getType() - 返回块类型。
getData() - 返回块数据。
find($key) - 通过键返回特定数据。
insert($key, $value) - 将数据插入到块中。
update($key, $value) - 更新块中的数据。
delete($key) - 从块中删除数据。
toArray() - 将块作为数组返回。
toHTML($templatePath) - 将块作为 HTML 返回。

EdiorJS 类

此类是集合的包装器。它是一个单例，具有一些方法。以下是所有方法的列表；

toJSON() - 返回JSON格式的集合字符串。使用此方法在前端使用数据非常重要。
toHTML($templatesPath) - 将集合渲染为HTML。

关于模板

此包使用模板来渲染块。集合需要一个包含模板的目录。此目录的结构如下；

editorjs-templates/
├─ image.php
├─ header.php
├─ paragraph.php

您可以给目录命名，但是给文件命名时，根据块类型命名很重要。所以，如果您想使用header模板，您应该将其命名为header.php。

模板使用PHP的默认语法，渲染发生在块的toHTML()方法内部。这意味着您可以访问所有块的方法和数据。以下是一个image模板的示例；

<img src=" <?= $this->find('file.url') ?> " alt=" $this->find('alt') ?? '' ">

感谢您看到最后。如果您有任何问题，请随时联系我。

megasteve19 / editorjs

维护者

详情