Как сделать mathjax в предоставленной строке HTML в реагировать? - PullRequest
Новая
       12

Как сделать mathjax в предоставленной строке HTML в реагировать?

0 голосов
/ 03 июля 2019

Я пытаюсь отобразить синтаксис Mathjax в этом компоненте реагирования. У меня есть эта строковая константа в компоненте Mathjax, и я также включил Mathjax cdn и скрипт конфигурации в index.html. Кто-нибудь может мне помочь? 

import React, { Component } from 'react';

class Mathjax extends Component {
    render() {
        const text='<span style="font-family:Tahoma; font-size:10pt"><strong><span class="my-math" style="font-size:13px">\({{4\eta \Delta P} \over {{r^2}L}}\)</span></strong>&nbsp;</span>'

        return (
            <div>
             <span dangerouslySetInnerHTML={{__html:text}}></span>   
            </div>
        );
    }
}

export default Mathjax;

//App component
import React from 'react';
import './App.css';
import Mathjax from './Mathjax';
function App() {
  return (
    <div className="App">
    <Mathjax />
    </div>
  );
}

export default App;


//index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
   <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
    </script>
    <script type="text/javascript" async
      src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML">
    </script>

   <title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
 </body>
</html>

Это рендеринг ({{4eta Delta P} выше {{r ^ 2} L}}), но результат должен был быть 4ηΔP / r ^ 2L

...