[!WARNING]
React Simple Chatbot 已不再维护。我建议使用 react-chatbotify 作为替代方案。

React 简单聊天机器人

一个用于创建对话式聊天的简单聊天机器人组件

开始使用

npm install react-simple-chatbot --save

使用方法

在官网上有几个示例。以下是第一个入门示例：

import ChatBot from 'react-simple-chatbot';

const steps = [
  {
    id: '0',
    message: '欢迎使用 React 聊天机器人！',
    trigger: '1',
  },
  {
    id: '1',
    message: '再见！',
    end: true,
  },
];

ReactDOM.render(
  <div>
    <ChatBot steps={steps} />
  </div>,
  document.getElementById('root')
);

带有 AI 的 React 简单聊天机器人

1. CodeParrot AI - 该机器人将帮助您更好地理解此仓库。您可以询问代码示例、安装指南、调试帮助等更多内容。

React 简单聊天机器人相关媒体报道

1. webdesignerdepot
2. blogduwebdesign
3. codrops

使用 react-simple-chatbot 构建的项目

1. Seth Loh 官网 - Seth Loh 的个人网站（演示）
2. Paul Jiang 官网 - Paul Jiang 的个人网站（演示）
3. 思科合作伙伴支持 API 聊天机器人 - 包含截图的代码，可帮助您构建自己的思科序列号查询聊天机器人。
4. Chatcompose - 用于会话式营销和支持的聊天机器人平台。
5. Mixat - 面向青少年的新闻聊天机器人，同时也有应用版本（iOS 或 Android）。

您是否使用 react-simple-chatbot 构建了什么项目？请提交 PR 并将其添加到此列表中！

如何贡献

请查看贡献指南

作者

Lucas Bassetti

另请参阅参与本项目的贡献者列表。

许可证

MIT · Lucas Bassetti

React Simple Chatbot 快速上手指南

⚠️ 重要提示：本项目（react-simple-chatbot）已停止维护。作者建议新项目使用替代方案 react-chatbotify。本指南仅供现有项目维护或学习参考。

环境准备

• 系统要求：支持 Node.js 的操作系统（Windows, macOS, Linux）
• 前置依赖：
  • Node.js (建议版本 14+)
  • npm 或 yarn
  • React 项目环境（需已初始化 React 应用）

安装步骤

在项目根目录下运行以下命令安装依赖：

npm install react-simple-chatbot --save

国内开发者如遇下载缓慢，可配置淘宝镜像源加速：

npm config set registry https://registry.npmmirror.com
npm install react-simple-chatbot --save

基本使用

以下是一个最简单的对话流程示例，包含欢迎语和结束语：

import ChatBot from 'react-simple-chatbot';

const steps = [
  {
    id: '0',
    message: 'Welcome to react chatbot!',
    trigger: '1',
  },
  {
    id: '1',
    message: 'Bye!',
    end: true,
  },
];

ReactDOM.render(
  <div>
    <ChatBot steps={steps} />
  </div>,
  document.getElementById('root')
);

说明：

• steps 数组定义了对话的逻辑流程。
• id：每一步的唯一标识。
• message：机器人显示的消息内容。
• trigger：指定下一步骤的 id。
• end: true：标记对话在此步骤结束。