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

Question

我在React中动态导入了MathJax，方法是将接受的(更新的(答案从Adding script标记中调整到React/JSX，即：

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/