@questflow/canvas
v0.2.0
Published
```typescript interface CanvasProps { idToken: string; // 通过"获取用户的id_token"获取 theme?: 'light' | 'dark'; // 主题,默认为light template?: { [key: string]: any }; // 模板对象,默认没有模板对象 flowName?: string; // 新建流程的名称,默认为New Flow flowDescription?: string; // 新建流
Downloads
11
Readme
interface CanvasProps {
idToken: string; // 通过"获取用户的id_token"获取
theme?: 'light' | 'dark'; // 主题,默认为light
template?: { [key: string]: any }; // 模板对象,默认没有模板对象
flowName?: string; // 新建流程的名称,默认为New Flow
flowDescription?: string; // 新建流程的描述,默认为New Flow description
onPublish?: (publishedFlow: PublishedFlow) => void; // 发布后回调
onPre?: () => void; // 当点击返回时候的回调
showPublishAsTemplate?: boolean; // 是否展示 publish as template按钮,默认不展示
showPublish?: boolean; // 是否展示 publish 按钮,默认不展示
showSave?: boolean; // 是否展示 save 按钮,默认不展示
questflowURL?: string; // questflow地址,用于组件与questflow服务器通信
}
onPublish回调参数
interface PublishedFlow {
createdAt: Date; // 创建时间
name: string; // 流程名称
isPublished: boolean; // 是否已经发布
publishedAt: Date; // 发布时间
flowId: string; // 流程id
webhook?: string; // 执行流程的webhook
}
###一个使用的示例,可以使用create-react-app,然后替换App.tsx文件内容
import React from 'react';
import ReactDOM from 'react-dom';
import Canvas, { PublishedFlow } from '@questflow/canvas';
function App() {
const idToken = 'eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6ImRQRmFnYnhObW1KM21zdHk2RXpuTmV1WGhpTE5LMGpmSlZhdlZDWXZtRWMifQ.eyJzdWIiOiI2NDVjYWFhMGVhM2UwZDk3YjcyNWNmY2UiLCJhdF9oYXNoIjoiUWljOEtpV0pBenRuUEliQnNSamdEdyIsInNpZCI6Ik9qeFhHQXVJa2lNWU1iaGpVVEtGTSIsImF1ZCI6ImZvb3RwcmludCIsImV4cCI6MTY4MzgyNjg5MCwiaWF0IjoxNjgzODIzMjkwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjMwMDAvYXBpL29pZGMifQ.S8Rrrn-r2mOwUpclVkWd2P6Rv3oNhOWvHwnDIjRTVjFMkeujBMWgH3aTWhvtoGBKPy3si7E2EmV5O572UTaaEr_mBljSjIiCabzvdYhbwnSw6MSpwNdt-io-G9Rxb8Zm9VFHsvnxNif2ueHc50eo9vPtAI6m47e1MU6irVBOOOmEz_6xHMCv397PXxVfpTF4peHsMNueceK-BYgjAbiXP52JJ4AeIvgwOEo5vR4ZdLMzS5KdSvELa08j_ag8KumKuK2njlaontIo2-56j_f2SvUSs7hWJfHC7F1k0VYMWcLjdmxcbucHIaViIyWszS-hmZXjQvkjUaM8blvjSd_Zfg'
const onPublish = (flow: PublishedFlow) => {
console.log(flow)
}
return (
<div className="App">
<Canvas flowId="644a36d563b13a9b5199b672" idToken={idToken} questflowURL={'https://staging.questflow.ai'} onPublish={onPublish}
showSave={true} showPublish={true} />
</div >
);
}
export default App;