在vue中渲染数学公式

sf6xfgos 于 2023-03-03 发布在 Vue.js

关注(0)|答案(1)|浏览(198)

数学公式在vue中从数据库中提取时没有以应有的方式呈现。它发生在chrome中，但在firefox中工作正常。就像这样-

- 镀 chrome ：**

- 在火狐中：**

通过一些研究，我发现一些第三方库可以正确显示数学公式，如katex，mathjax。
但是如何将它们与vue或任何愿意为vue建议任何其他库的人一起使用呢？
我已经看过了mathjax的文档，但是没有发现任何对vue有用的东西。

- 我的密码：**

<div
              v-for="(solutions, index) in solutionsList"
              :key="index"
              class="card solutions_section_card"
              style="margin-bottom: 15px"
            >
              <a
                v-on:click="getSolution(solutions.body, solutions.description)"
                class="solutions_section_card_link click_cursor"
                v-html="solutions.body"
              >

              </a>
            </div>

vue.js

来源：https://stackoverflow.com/questions/71994265/render-math-equations-in-vue

1条答案

按热度按时间

fwzugrvs1#

它可以用mathjax完成
首先在你的项目中安装它，然后将它的目录从node_module复制到你的assets（为了更好的可访问性），然后像这样导入es5模块到你的组件：

import("@/assets/mathjax/es5/tex-chtml-full.js")

还有一件事，将此代码添加到您的手表或安装的钩子（在您从API或其他东西获得您的方程之后）：

if (solutionsList) {
      if ("MathJax" in window) {
        nextTick(() => {
          window.MathJax.typeset();
        });
      }
    }

然后你所有的数学公式都会在浏览器中显示为漂亮模式

赞(0）回复(0）举报 2023-03-03

我来回答

在vue中渲染数学公式

1条答案

相关问题

热门标签

最新问答