随着科技的不断发展，陪诊小程序作为医患沟通的新工具逐渐成为关注焦点。本文将带领你通过使用React和Node.js技术栈，构建一个功能强大且用户友好的陪诊小程序，实现医患互动的便捷和高效。

1. 准备工作

确保你的开发环境中已安装了Node.js和npm。在终端中执行以下命令初始化项目：

npx create-react-app patient-companion-app
cd patient-companion-app
npm install express body-parser

2. 后端开发

创建一个名为 server.js 的后端文件，使用Express和body-parser搭建服务器：

const express = require('express');
const bodyParser = require('body-parser');
const app = express();
const port = 3001;

app.use(bodyParser.json());

app.post('/api/consult', (req, res) => {
  const symptoms = req.body.symptoms;

  // 在实际应用中，这里应该有一个智能导诊系统的算法来匹配医生和科室

  // 模拟返回医生信息
  const doctorInfo = {
    name: 'Dr. Smith',
    specialty: 'Internal Medicine',
    contact: 'dr.smith@example.com',
  };

  res.json(doctorInfo);
});

app.listen(port, () => {
  console.log(`陪诊小程序后端正在监听端口 ${port}`);
});

3. 前端开发

使用React创建一个简单的陪诊小程序前端。替换 src/App.js 文件的内容：

import React, { useState } from 'react';
import './App.css';

function App() {
  const [symptoms, setSymptoms] = useState('');
  const [doctorInfo, setDoctorInfo] = useState(null);

  const consultDoctor = async () => {
    try {
      const response = await fetch('http://localhost:3001/api/consult', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({ symptoms }),
      });

      const data = await response.json();
      setDoctorInfo(data);
    } catch (error) {
      console.error('Error consulting doctor:', error);
    }
  };

  return (
    <div className="App">
      <h1>陪诊小程序</h1>
      <form>
        <label htmlFor="symptoms">输入症状：</label>
        <input
          type="text"
          id="symptoms"
          name="symptoms"
          value={symptoms}
          onChange={(e) => setSymptoms(e.target.value)}
          required
        />
        <button type="button" onClick={consultDoctor}>
          咨询医生
        </button>
      </form>
      {doctorInfo && (
        <div className="doctor-info">
          <h3>医生信息：</h3>
          <p>姓名：{doctorInfo.name}</p>
          <p>专业：{doctorInfo.specialty}</p>
          <p>联系方式：{doctorInfo.contact}</p>
        </div>
      )}
    </div>
  );
}

export default App;

4. 运行应用

在终端中分别运行前端和后端：

# 在项目根目录下运行前端
npm start

# 在项目根目录下运行后端
node server.js

打开浏览器，访问 http://localhost:3000/，你将看到一个交互式的陪诊小程序。用户可以输入症状，点击按钮咨询医生，并显示医生的相关信息。

这个示例演示了如何使用React和Node.js构建一个实用的陪诊小程序，通过前后端分离的架构，实现了医患沟通的高效和便捷。在实际开发中，你可以进一步扩展功能，优化用户体验，加强安全性，以满足更多医疗场景的需求。