README

将后端数据发送到 Laravel 应用程序的前端

用于从后端向前端发送数据 JS 变量的包。

将形如 "key" => "value" 的仓库打包，并提供将数据转换为数组和 JSON 的方法。

安装

使用以下命令通过 composer 安装此包

$ composer require avto-dev/back2front-laravel "^2.0"

需要安装 composer (如何安装 composer)。

您需要修复包的主要版本。

要发布配置和资源，请在控制台执行以下命令

$ php artisan vendor:publish --provider="AvtoDev\\Back2Front\\ServiceProvider" --force

此命令将发布文件 ./config/back-to-front.php，其中包含包的基本设置，以及 public/vendor/back-to-front/front-stack.js，其中包含用于获取数据的 JavaScript 对象。

用法

在后端

要获取后端的对象堆栈，可以使用全局助手

<?php

backToFrontStack();

或从服务容器获取对象

<?php

use AvtoDev\Back2Front\Back2FrontInterface;

/** @var Back2FrontInterface $service */
$service = resolve(Back2FrontInterface::class);

方法

Back2Front 对象提供以下公共方法

您还可以迭代对象。

Back2Front 支持在 put、get、has 和 forget 方法中使用点表示法。

<?php

backToFrontStack()->put('user.name', 'John Doe');

在前端将有对象

{
    "user": {
        "name": "John Doe"
    }
}

在前端

为了在前端输出数据，您应该在您的 blade-template 中添加以下代码（最好在结果 HTML 文档的 head 部分中）

<script type="text/javascript">
    Object.defineProperty(window, 'DATA_PROPERTY_NAME', {
        writable: false,
        value: {!! backToFrontStack()->toJson() !!}
    });
</script>

或者 使用 blade 指令

@back_to_front_data('DATA_PROPERTY_NAME')

它为全局对象 window 创建一个名为 DATA_PROPERTY_NAME 的属性，并预先添加数据。

DATA_PROPERTY_NAME 的默认值是 'backend'。如果您使用自定义值并想在前端使用 front-stack 助手，则需要在使用助手之前调用 window.frontStack.setStackName('custom_name');。

包包含用于访问数据对象的 JavaScript 助手。

您可以在页面上添加 js 文件来使用它

<script src="/vendor/back-to-front/front-stack.js" type="text/javascript"></script>

您也可以将其用作 require.js 依赖项。

这将在 window.frontStack 中创建一个对象，该对象提供以下方法

示例

在后端

backToFrontStack()->put('user_id', $user->id);

在前端

<script type="text/javascript">
    console.log(window.frontStack.get('user_id'));
</script>

测试

为了测试包，我们使用 phpunit 框架和 docker-ce + docker-compose 作为开发环境。因此，在克隆存储库后，只需在终端中写入

$ make build
$ make latest # or 'make lowest'
$ make test

对于使用 Mocha 和 Chai 框架测试 JavaScript 代码。

在控制台运行 npm test。覆盖率报告将在 coverage/coverage.json 中，并且在 coverage/lcov-report/index.html 中为人类。

变更日志

变更日志可以在这里找到。

支持

如果您发现任何包错误，请在此存储库中创建一个问题。

许可证

这是开源软件，许可协议为MIT 许可证。