2

docs/feedback.md

@@ -4,7 +4,10 @@ label: "意见"
 sidebar_position: 2
 slug: /
 ---
+import {MDXCreateElement }from'@mdx-js/react';
+import MyForm from'../../src/pages/FeedbackInput';
 
 欢迎您提供反馈意见！请在下方的表单中填写您的意见和建议，我们会认真考虑并改进我们的网站和服务。
 
 ### 提交意见反馈
+<FeedbackInput />

sidebars.js

@@ -6,4 +6,8 @@ module.exports = {
       label: 'Docs',
     }
   ],
+  module:{
+    rules:[{test: /\.mdx$/,
+    use: ['babel-loader','@mdx-js/loader']}]
+  }
 };

src/pages/feedback.js

@@ -1,29 +1,26 @@
 import React, { useState } from 'react';
 
-const FeedbackPage = () => {
+const FeedbackInput = ({ onSubmit }) => {
   const [feedback, setFeedback] = useState('');
 
   const handleSubmit = (e) => {
     e.preventDefault();
-    // 处理提交反馈的逻辑，例如将 feedback 发送到服务器或保存到数据库中
-    console.log('Feedback submitted:', feedback);
+    onSubmit(feedback);
+    setFeedback(''); // 清空输入框
   };
 
   return (
-    <div>
-      <h1>意见反馈</h1>
-      <form onSubmit={handleSubmit}>
-        <label>
-          意见反馈：
-          <textarea
-            value={feedback}
-            onChange={(e) => setFeedback(e.target.value)}
-          />
-        </label>
-        <button type="submit">提交反馈</button>
-      </form>
-    </div>
+    <form onSubmit={handleSubmit}>
+      <label>
+        意见反馈：
+        <textarea
+          value={feedback}
+          onChange={(e) => setFeedback(e.target.value)}
+        />
+      </label>
+      <button type="submit">提交反馈</button>
+    </form>
   );
 };
 
-export default FeedbackPage;
+export default FeedbackInput;