Closed HediDar closed 8 months ago
Hi there!
It looks like you're using the MathJaxContext
wrong. There should only be ONE MathJaxContext
in all of your app and judging from you component you seem to include one MathJaxContext
in every usage of your component. Try to wrap you entire app in ONE MathJaxContext
and you will see that the onLoad
property works as expected.
COULD of course add so that this works as well but since it's not the intended use of the MathJaxContext
, I'm unsure of whether it is the desired / expected / correct behaviour. I will think about it.
Feel free to study the usage section on how to use this library and let me know if it still doesn't work for you after using it in the expected way :)
https://github.com/fast-reflexes/better-react-mathjax#usage
Sandbox where showing that the onLoad
works great:
https://codesandbox.io/p/sandbox/better-react-mathjax-50-gknq9t
I will close this since I'm sure that onLoad
property will be ignored if there are nested MathJaxContext
s; only the outermost context which actually downloads MathJax will trigger the onLoad
function. I will perhaps add a warning message about onLoad
functions in nested MathJaxContext
s in the future to make this more obvious.
Feel free to reopen if you think this is wrong.
I'm using the onload property that better-mathjax-react library offers to signal the component that the display of the equation has finished, but this propoerty doesn't work for some reason, so how to solve this problem?
This is the component responsible for displaying the texts:
const myComponent= (props) => {
const config = { tex2jax: { inlineMath: [ ["$", "$"], ["\(", "\)"], ], displayMath: [ ["$$", "$$"], ["\[", "\]"], ], processEscapes: true, }, };
return ( <MathJaxContext onLoad={() => { console.log( "the equation display should end here, but this function never gets called" ); }} config={config} version={2} hideUntilTypeset="first"