javascript - 如何在 botpress ver 11.9.5 中自定义用户对话框?
问题描述
我正在尝试为 botpress 聊天中的每个对话框添加时间戳。到目前为止,我可以在机器人的对话框中添加这个时间戳,但是我需要一些指针来将其添加到用户的对话框和选择技能中。
export class InfaText extends React.Component {
message = this.props.text
getTimestamp = () => {
let date = new Date();
let options = {
month: "short",
day: "numeric", hour: "2-digit", minute: "2-digit"
};
return date.toLocaleTimeString("en-us", options);
}
render() {
return (<div className="infaTextMain">
<p className="infaTextMessage">{this.message}</p>
<small className="infaTextTimestamp">{this.getTimestamp()}</small>
</div>)
}
}
注意:Botpress v11.9.5
此外,是否有一种通用方法可以为所有对话框添加时间戳? 更新
我完全按照@eff_it 的说明进行操作
我将MessageWrapper和MySuperOverride函数复制到modules\infa-module\src\views\lite\index.jsx
modules\channel-web\src\views\full\index.tsx
然后在文件覆盖下添加以下片段
{
module: 'infa-module',
component: 'MySuperOverride'
}
仍然没有效果,@eff_it 请看一下并建议这里是否缺少某些东西?
解决方案
你试过 BP 12 吗?自定义组件现在更容易实现。
您可以使用setMessageWrapper
botpressWebchat 商店的 包装每条消息,但要这样做,您需要在使用另一个自定义组件初始化网络聊天时使用 overrides 属性(该组件不会呈现任何内容,但会使用网络聊天商店)。这是一个示例视图/lite/index.jsx
export const MessageWrapper = props => (
<div>
<p style={{ color: 'blue' }}>sent on: {new Date(props.sentOn).toDateString()}</p>
<div style={{ background: 'black', color: 'white' }}>{props.children}</div>
</div>
)
export const MySuperOverride = props => {
props.store.setMessageWrapper({ module: 'yourModule', component: 'MessageWrapper' })
return null
}
然后,当您初始化 botpressWebchat 时,您可以简单地使用 overrides api,如下所示
window.botpressWebChat.init({
overrides: {
before_container: {
module: 'yourModule',
component: 'MySuperOverride'
}
}
})
参考文档,有更多关于自定义组件和自定义模块的信息。这是生成的渲染:
推荐阅读
- python - 无法以足够的精度将 matlab datenum 格式转换为 python datetime
- sql - SQL/Postgres:查找具有相同值的元组(对于另一列中的给定值)
- rx-java2 - RXJava Observable 仅在以匿名类型订阅 Observer 时发出项目
- ruby-on-rails - 被阻止的主机:rails 6.0.0 上的 localhost ruby
- git - 无法在 git 存储库上上传文件
- android - RecyclerView Button-only item onClick
- azure-devops - 在 Azure Devops 中,如何仅向 1 个存储库授予单个个人权限,而不是项目中的所有存储库?
- visual-studio-code - 为什么 Visual Studio Code 拒绝运行并显示此错误消息?
- php - php文件上传编码
- python - 我该如何解决这个 __init__ self.init_window() 错误