Search code examples
androidiosreact-nativemathjax

'react-native-mathjax' not rendering for single backslash


I am using 'react-native-mathjax' to render math equations. 'react-native-mathjax' not able to render for single backslash. When I add double backslash in place of single backslash and four backslashes in place of double backslash in the equation given below, 'react-native-mathjax' renders the equation, is there any solution?

    import React from 'react';
    import { View, Text } from 'react-native';
    import MathJax from 'react-native-mathjax';

    function Test() {
            return (
                   <View>
                     <MathJax
                        html={<p><span class="math-tex">\(\begin{bmatrix} 2 &1 \\[0.3em] 3&4\\[0.3em] \end{bmatrix}\)</span></p>} // not rendering this eqation  
                  />
                   </View>
     );
    }
    export default Test;

Solution

  • You are using custom html data in react-native-mathjax which requires double backslash in place of single backslash and four backslashes in place of double backslash to render mathematical equations correctly. When data will come from API it will automatically contain a double backslash in place of single backslash and four backslashes in place of double backslash. So you don't have to do anything new in react-native-mathjax.