使用 MathJax 访问 MathJax.Hub 作为 React 中的脚本动态加载

Question

我通过改编接受的（更新的）答案在 React 中动态导入了 MathJax，即：

const MathJaxScript =() => {
  const script = document.createElement('script');
  script.type = "text/javascript";
  script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js';
  script.async = true;

  var config = 'MathJax.Hub.Config({' +
                 'extensions: ["tex2jax.js","TeX/AMSmath.js","TeX/AMSsymbols.js"],' +
                 'jax: ["input/TeX","output/HTML-CSS"],' +
               'tex2jax: {inlineMath: [ ["$","$"], ["\(","\)"] ],displayMath: [ ["$$","$$""], ["\[","\]"] ],processEscapes: true}});'
               +
               'MathJax.Hub.Startup.onload();'
               ;
      document.body.appendChild(script);
    return () => {
      document.body.removeChild(script)
    }
};
export default MathJaxScript;

LaTex 现在可以很好地显示在我的页面上，但是当我更新内容时，MathJax 无法解析新的 LaTex 内容。我需要打电话给 MathJax.Hub.Queue(["Typeset",MathJax.Hub]); 才能这样做。使用我当前的设置访问 MathJax.Hub 的最佳方式是什么？

Answer 1

根据 Peter 的评论，我可以使用这个加载 MathJax：

const MathJaxScript =() => {
  const script = document.createElement('script');
  script.type = "text/javascript";
  script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js';
  script.async = true;
};
export default MathJaxScript;

然后调用脚本后，

window.MathJax={tex: {inlineMath: [["$", "$"], ["\(", "\)"]],packages: ["base", "newcommand", "configMacros"]},svg: {fontCache: "global"}};

更改配置。

我意识到这实际上出现在最新发布的文档中： https://docs.mathjax.org/_/downloads/en/v3.0-latest/pdf/

使用 MathJax 访问 MathJax.Hub 作为 React 中的脚本动态加载

Access MathJax.Hub with MathJax loaded dynamically as script in React

javascript

mathjax

reactjs