diff --git a/package.json b/package.json
index 63cdbd41aa7577460ac0bd54a7bac7157e72dbea..219e6f08aace81b6c0a62af0a42157bd3d4afd72 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "react": "^18.2.0",
     "react-bootstrap": "^2.10.2",
     "react-dom": "^18.2.0",
+    "react-mathjax": "^1.0.1",
     "react-router-dom": "^6.23.0",
     "react-scroll": "^1.9.0"
   },
@@ -23,6 +24,7 @@
     "@types/node": "^20.12.10",
     "@types/react": "^18.2.66",
     "@types/react-dom": "^18.2.22",
+    "@types/react-mathjax": "^1.0.4",
     "@types/react-scroll": "^1.8.10",
     "@typescript-eslint/eslint-plugin": "^7.2.0",
     "@typescript-eslint/parser": "^7.2.0",
diff --git a/src/contents/model.tsx b/src/contents/model.tsx
index 09aada405f9ee1c7a9269a1a0e500d6e49609c48..ea243f8330ddbbdda288a007a27b44e8b5ff2560 100644
--- a/src/contents/model.tsx
+++ b/src/contents/model.tsx
@@ -1,6 +1,12 @@
 import { Nav } from 'react-bootstrap';
 import { Link,Element } from 'react-scroll';
 import React,{useEffect,useState} from 'react';
+import MathJax from 'react-mathjax';
+
+
+const tex = `f(x) = \\int_{-\\infty}^\\infty
+    \\hat f(\\xi)\\,e^{2 \\pi i \\xi x}
+    \\,d\\xi`
 
 
 // sidenavbar begin
@@ -87,7 +93,18 @@ export function Model() {
               <h4 className="center-text">Section 3</h4>
               <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
               <p className="indent">las ijffs aiskfd fskj iiwls asd.aass ffas awssd awus iisal fask.aisisad ksjdfkaf iwjasifjakdshf wijdfalksjf wiksjkfjksalhf, gsahfjhgejkfh  uhaejkfh sjdihgfuqiw jh sjiafhjsaj fh asd.</p>
-              
+
+              <MathJax.Provider>
+                <div className='indent'>
+                  {/* 行内编辑数学公式，相比于下面那个方便一些。去掉inline的话效果就和下面那个一样了。 */}
+                    This is an inline math formula: <MathJax.Node inline formula={`f(x) = \\int_{-\\infty}^\\infty
+                                                                                  \\hat f(\\xi)\\,e^{2 \\pi i \\xi x}
+                                                                                  \\,d\\xi`} />
+                    And a block one:
+                  {/* 数学公式编辑在此文件的顶部，使用latex语法 */}
+                    <MathJax.Node formula={tex} />
+                </div>
+              </MathJax.Provider>
               </div>
 
               </Element>
diff --git a/yarn.lock b/yarn.lock
index ef65099680e8f7c18a9b1bdf3476b421a81b752e..69887ef479e6484103216f1874eb8a5b374f7c32 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -628,6 +628,13 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-mathjax@^1.0.4":
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/@types/react-mathjax/-/react-mathjax-1.0.4.tgz#b6c75bdf700704c511f3bf21727e5db73799271c"
+  integrity sha512-gxtONNuQUZhNOKeQGxLGxeeqvPc2gBGMFB8t+7WnXQBHQdp+MEhd1Ycnvxjycnxsko87k/0sYooVgLBsIWU6VQ==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-scroll@^1.8.10":
   version "1.8.10"
   resolved "https://registry.yarnpkg.com/@types/react-scroll/-/react-scroll-1.8.10.tgz#585a5c4bd0654434f3e55a08e94ed2e048bae7c7"
@@ -1387,6 +1394,11 @@ levn@^0.4.1:
     prelude-ls "^1.2.1"
     type-check "~0.4.0"
 
+load-script@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4"
+  integrity sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA==
+
 locate-path@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286"
@@ -1629,6 +1641,13 @@ react-lifecycles-compat@^3.0.4:
   resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
   integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
 
+react-mathjax@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/react-mathjax/-/react-mathjax-1.0.1.tgz#a8c282e75d277a201632dfd07edf41edda372b4b"
+  integrity sha512-+mjFcciZY3GQoqiQm3aRTyDjgBKuoaXpY+SCONX00jScuPpTKwnASeFMS5+pbTIzDf5zPT2Y9ZZfQ9U/d4CKtQ==
+  dependencies:
+    load-script "^1.0.0"
+
 react-refresh@^0.14.0:
   version "0.14.2"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.14.2.tgz#3833da01ce32da470f1f936b9d477da5c7028bf9"