API 文档
一个基于TypeScript的API,用于LARA Interactive API. 这还包括共享的API的所有类型 与执行 API 的 LARA- side 的服务器侧 Typescript 文件相连接.
注:此文件(在/docs中)是自动生成的,属于 lara-typescript 使用 类型文件
通过将API客户端的readme文件与自动生成的输出合并. 如果您希望编辑此文档, 请编辑
lara-typescript/src/interactive-api-client/README.md。 。 。 .
安装
首先安装软件包 :
npm i --save @concord-consortium/lara-interactive-api
然后导入到您的代码中 :
import * as interactiveApi from "@concord-consortium/lara-interactive-api"
或导入必要的函数:
import { setHeight, useInteractiveState } from "@concord-consortium/lara-interactive-api"
aPI 编译为 TypeScript 并包含输入 .d.ts 文件夹中的文件。 这些打字是
由 TypeScript 编译器自动加载, 因此您现在需要安装单独的 @types/... 软件包.
使用量
API 函数
所有 Interactive API 帮助被导出为单个函数 。 例如:;
import { setHeight, setHint, getAuthInfo } from "@concord-consortium/lara-interactive-api"
一些功能可能接受类型,例如:. getInteractiveState<InteractiveState>()当更多的类型被接受,
类型变量的顺序很重要,它是 InteractiveState, (中文(简体) ), AuthoredState, (中文(简体) ), DialogState,以及
IGlobalInteractiveState。如果您想要跳过类型变量,只需使用 {} 位置和任何类型变量
结尾默认为 {},例如:
const getInitInteractiveMessage<IInteractiveState, {}, {}, IGlobalInteractiveState>();
钩子
如果您在使用 React , 您会希望使用将 API 函数更轻松地包裹的钩子
使用表单。 钩子从头开始 use 前缀。 要先用钩子导入 :
import { useInteractiveState } from "@concord-consortium/lara-interactive-api"
然后使用您在反应组件中的类型变量调用钩子.
这里有一个很小的例子: useInteractiveState 钩:
const { interactiveState, setInteractiveState } = useInteractiveState<IInteractiveState>();
...
const handleButtonClick = () => {
// Functional update, usually safer option:
setInteractiveState((prevState: InteractiveState) => ({ numButtonPresses: prevState.numButtonPresses + 1 }));
// Or regular update that can cause troubles when new state is based on the previous one:
// setInteractiveState({ numButtonPresses: interactiveState.numButtonPresses + 1 });
}
...
<button onClick={handleButtonClick}>{interactiveState.numButtonPresses}</button>
呼叫电话 setInteractiveState 由钩子返回的方法将同时更新钩子内部的状态
也向LARA发送信息. 这意味着,打电话 setInteractiveState 将触发新的反应 使您
使用 useInteractiveState 钩.
这同样适用于其他基于国家的钩子及其起落架:
useAuthoredStateuseGlobalInteractiveState