MyData帮助UI
MyDataHelpsUI是一组基于此功能的可重复使用的 React 组件 MyData帮助.js SDK。探索组件库 (原始内容存档于2018-10-26). ui.mydatahelps.org。 。 。 .
利用这个组件库来加速开发 自定义参与者视图 数字临床试验和数字治疗应用 MyData帮助平台将MyDataHelpsUI纳入参与者的意见中,将有助于你遵循最佳做法,实现结果的回归和eCOA.
你也会发现 MyDataHelps Startter Kit 数据 帮助。 启动器套件是一个反应网络应用模板,为您设计,可以将叉/克龙作为开发自定义视图的起点.
通过 :
npm install @careevolution/mydatahelps-ui
在参与者视图中使用 MyDataHelpsUI 的示例
import { Action, Card, Layout, SurveyTaskList } from "@careevolution/mydatahelps-ui"
export default function () {
return (
<Layout>
<Card className='primary-card'>
<Action
title="Do you think you have COVID-19?"
subtitle="It's important to tell us immediately if might have COVID-19. Click or tap here to report a new infection, symptoms, or close contact."
onClick={() => MyDataHelps.startSurvey('New COVID Infection')} />
</Card>
<Card>
<SurveyTaskList status="incomplete" title="Tasks" limit={3} />
</Card>
</Layout>
);
故事书
此库使用 故事书. 考察实例,访问 (原始内容存档于2018-10-26). ui.mydatahelps.org。 。 。 .
要使用您所测试的 MyDataHelp 参与者的数据来运行故事书预览 :
- 克隆这个还原
- 获取一个 参与者访问令牌 - 使用浏览器dev工具,同时登录为 mydatahelps.org的测试参与者,或者使用 REST API.
- 提示: 如果使用浏览器 Dev 工具, 请检查请求中的回应 https://mydatahelps.org/identityserver/connect/token 互联网档案馆的存檔,存档日期2013-12-21。 。 。 .
- 在您的根目录中创建 . env 文件, 并附带符号细节 .
.env
-----
STORYBOOK_PARTICIPANT_ACCESS_TOKEN=05e211e4df46ca7537e064bde44148a7
STORYBOOK_PARTICIPANT_ENVIRONMENT_API=https://mydatahelps.org/
- 运行
npm ci以安装依赖. - 运行
npm run storybook阅读故事书.
如果您有问题需要运行故事手册, 特别是围绕正在使用的 NODE OPTIONS , 请尝试升级节点到最新版本 .
构成部分
这些组成部分分为三类:
演示文稿组件
演示文稿组件不获取数据来填充自己 。 它们是UI观点和连通部分的基本构件. 这些都是一些东西,例如按钮,卡片, 和显示一个单一的调查任务.
集装箱组件
集装箱组件通过 MyDataHelps.js SDK获取数据. 这些组件只有在MyDataHelps内部的视图中使用,或通过手动将访问令牌传递到SDK时才会起作用.
视图
观点将集装箱和演示组件组合起来,形成完全预先建立的经验。 例如,"Home View"包含一个中多个连接组件:
- 项目标题
- 最新通知
- 调查任务
- 项目支助