README

Momentum Lock 是一个 Laravel 扩展包，允许您在前端级别处理 Laravel 授权。

该包仅适用于与 Laravel Data 对象和 TypeScript Transformer 一起使用。

• 安装
  • Laravel
  • 前端
• 使用方法
• 高级 Inertia
• 动量

安装

Laravel

将包安装到您的 Laravel 应用中。

composer require based/momentum-lock

前端

前端包是无框架依赖的，可以很好地与任何 TypeScript 工作流一起使用。

安装 前端包。

npm i momentum-lock
# or
yarn add momentum-lock

使用方法

从 Laravel Data 提供的 Data 替换为 DataResource 扩展您的数据类。

use Momentum\Lock\Data\DataResource;

class UserData extends DataResource
{
    public function __construct(
        public int $id,
        public string $username
    ) {
    }
}

您可以通过手动指定能力列表，或者让包从相应的策略类中解析它们。

class UserData extends DataResource
{
    protected $permissions = ['update', 'delete'];
}

在 TypeScript Transformer 配置文件 typescript-transformer.php 中注册 DataResourceCollector。这个类帮助 TypeScript Transformer 处理 DataResource 类，并将权限追加到生成的 TypeScript 定义中。

return [
    'collectors' => [
+       Momentum\Lock\TypeScript\DataResourceCollector::class,
        Spatie\TypeScriptTransformer\Collectors\DefaultCollector::class,
        Spatie\LaravelData\Support\TypeScriptTransformer\DataTypeScriptCollector::class,
    ],
]

在前端，您可以使用 can 辅助函数。这个函数检查传递的对象上是否设置了所需的权限为 true，并可以在脚本或模板中使用。

<script lang="ts" setup>
import { can } from "momentum-lock"

const props = defineProps<{
  users: UserData[]
}>()
</script>

<template>
  <div v-for="user in users" :key="user.id">
    <a v-if="can(user, 'edit')" :href="route('users.edit', user)"> Edit </a>
  </div>
</template>

高级 Inertia

通过我的书 Advanced Inertia 将您的 Inertia.js 技能提升到下一个级别。学习高级概念，并使用 Laravel 和 Inertia.js 轻松构建和维护应用程序。

动量

Momentum 是一套旨在改善您构建 Inertia 动力应用程序体验的包。

• 模态框 — 为 Inertia 应用程序构建动态模态对话框
• 预飞检查 — Inertia 应用的实时后端驱动验证
• 分页器 — Laravel 分页的无头包装器
• 痕迹 — 用于 Inertia 的前端包，以使用 Laravel 路由
• 锁定 — 用于 Inertia 的前端包，以使用 Laravel 权限
• 布局 — Vue 3 应用程序的持久布局
• Vite 插件监视 — 在文件更改时运行 shell 命令的 Vite 插件

致谢

• Boris Lepikhin
• 所有贡献者

许可协议

MIT 许可证 (MIT)。请参阅 许可文件 了解更多信息。