TypeScript SDK
快速上手
迈出使用 Orion TypeScript SDK 的第一步。
安装
Orion 可以安装到新项目或现有项目中,只需添加一个依赖:
使用 NPM
npm install @tailflow/laravel-orion --save
使用 Yarn
yarn add @tailflow/laravel-orion
配置
安装完成后,下一步是对其进行配置(或称初始化),使其与你的 API 协同工作。
import {Orion} from "@tailflow/laravel-orion/lib/orion";
Orion.init('https://your-api.test');
Orion.setToken('access-token-here');
就是这样!接下来我们来设置模型。
设置模型
让我们创建第一个模型并查询 API。从你的 Laravel API 中任选一个模型即可——这里以 Post 模型为例。
在你的 TypeScript 应用中添加一个 Post 类,并让它继承 Model。
// post.ts
import {Model} from "@tailflow/laravel-orion/lib/model";
export class Post extends Model {
}
接下来,定义模型的属性及其资源名称。
// post.ts
import {Model} from "@tailflow/laravel-orion/lib/model";
export class Post extends Model<{
title: string,
body: string
}> {
public $resource(): string {
return 'posts';
}
}
恭喜,你已成功设置好模型,一切就绪,可以开始查询 API 了。
查询 API
Orion TypeScript SDK 让消费你的 API 变得异常简单。
如果你使用的是 Sanctum,在查询 API 之前需要先初始化 CSRF 防护。具体做法请参阅为 SPA 集成 Sanctum。
// 在应用的某个地方
import {Post} from '../post.ts';
// 获取文章列表
const posts = await Post.$query().get();
// 搜索文章
const posts = await Post.$query().lookFor('some value').search();
// 创建文章
const newPost = await Post.$query().store({
title: 'New post' // <-- 属性是有类型的,所以这里能获得很好的自动补全
});
console.log(newPost.$attributes.title); // <-- 这里也一样
// 获取文章
const post = await Post.$query().find(5);
// 更新文章
post.$attributes.title = 'Updated post';
await post.$save();
// 或者
await post.$save({title: 'Updated post'}); // <-- 这里也是
// 或者
const updatedPost = await Post.$query().update(5, {
title: 'Updated title' // <-- 当然,这里也是
});
// 删除文章
const deletedPost = await Post.$query().delete(5);
// 或者
await post.$destroy();