import{_ as n,c as s,o as a,a as p}from"./app-Dx9bNbfq.js";const t={},e=p(`<h2 id="使用" tabindex="-1"><a class="header-anchor" href="#使用"><span>使用</span></a></h2><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>MathJaxRenderer</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>msg aiMsg<span class="token punctuation">&quot;</span></span> <span class="token attr-name">:ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span><span class="token punctuation">&#39;</span>math&#39; + item.id<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span></span>
<span class="line">              {{ item.content }}</span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>MathJaxRenderer</span><span class="token punctuation">&gt;</span></span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="组件代码" tabindex="-1"><a class="header-anchor" href="#组件代码"><span>组件代码</span></a></h2><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"><span class="token comment">&lt;!-- @format --&gt;</span></span>
<span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span></span>
<span class="line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>mathContainer<span class="token punctuation">&quot;</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>math-container<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span></span>
<span class="line">    <span class="token comment">&lt;!-- {{ content }} --&gt;</span></span>
<span class="line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>slot</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>slot</span><span class="token punctuation">&gt;</span></span></span>
<span class="line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span></span>
<span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript"></span>
<span class="line">  <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span></span>
<span class="line">    <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">&#39;MathJaxRenderer&#39;</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token literal-property property">props</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token literal-property property">content</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token literal-property property">type</span><span class="token operator">:</span> String<span class="token punctuation">,</span></span>
<span class="line">        <span class="token keyword">default</span><span class="token operator">:</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token literal-property property">options</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token literal-property property">type</span><span class="token operator">:</span> Object<span class="token punctuation">,</span></span>
<span class="line">        <span class="token function-variable function">default</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token keyword">return</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token literal-property property">mathContainer</span><span class="token operator">:</span> <span class="token keyword">null</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token literal-property property">watch</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token literal-property property">content</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token function">handler</span><span class="token punctuation">(</span><span class="token parameter">newContent</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer <span class="token operator">&amp;&amp;</span> newContent<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer<span class="token punctuation">.</span>innerHTML <span class="token operator">=</span> newContent<span class="token punctuation">;</span></span>
<span class="line">            <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">renderMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">          <span class="token punctuation">}</span></span>
<span class="line">        <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token literal-property property">immediate</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token function">refreshMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token comment">// 确保容器存在</span></span>
<span class="line">        <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>$refs<span class="token punctuation">.</span>mathContainer<span class="token punctuation">;</span></span>
<span class="line">        <span class="token punctuation">}</span></span>
<span class="line"></span>
<span class="line">        <span class="token comment">// 强制重新渲染</span></span>
<span class="line">        <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">renderMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line">        <span class="token comment">// 返回Promise以便调用者可以在渲染完成后执行操作</span></span>
<span class="line">        <span class="token keyword">return</span> <span class="token keyword">new</span> <span class="token class-name">Promise</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">resolve</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$nextTick</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token function">resolve</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token function">configureMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">        window<span class="token punctuation">.</span>MathJax <span class="token operator">=</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token literal-property property">tex</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token literal-property property">inlineMath</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">              <span class="token punctuation">[</span><span class="token string">&#39;\\\\(&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;\\\\)&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token punctuation">[</span><span class="token string">&#39;$&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;$&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">displayMath</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">              <span class="token punctuation">[</span><span class="token string">&#39;$$&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;$$&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token punctuation">[</span><span class="token string">&#39;\\\\[&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;\\\\]&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">packages</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">              <span class="token string">&#39;base&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;ams&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;noerrors&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;noundefined&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;newcommand&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;boldsymbol&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;cancel&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;color&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;enclose&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;mhchem&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;physics&#39;</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">macros</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">              <span class="token comment">// 数学集合符号</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\mathbb&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbf&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\R&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbb{R}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\N&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbb{N}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Z&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbb{Z}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Q&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbb{Q}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\C&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mathbb{C}&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 极限、求和、积分</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\lim&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\lim\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\sum&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\sum\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\int&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\int\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\iint&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\iint\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\iiint&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\iiint\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\prod&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\prod\\\\limits&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 基本函数</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\frac&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\frac&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\sqrt&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\sqrt&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 三角函数</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\sin&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\sin&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\cos&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\cos&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\tan&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\tan&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\cot&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\cot&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\sec&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\sec&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\csc&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\csc&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\arcsin&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\arcsin&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\arccos&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\arccos&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\arctan&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\arctan&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 双曲函数</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\sinh&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\sinh&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\cosh&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\cosh&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\tanh&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\tanh&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 符号和常数</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\infty&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\infty&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\partial&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\partial&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\nabla&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\nabla&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\pi&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\pi&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\epsilon&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\epsilon&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\delta&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\delta&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Delta&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\Delta&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 矩阵相关</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\begin{matrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\begin{matrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\end{matrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\end{matrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\begin{pmatrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\begin{pmatrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\end{pmatrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\end{pmatrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\begin{bmatrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\begin{bmatrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\end{bmatrix}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\end{bmatrix}&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 对齐环境</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\begin{align}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\begin{align}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\end{align}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\end{align}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\begin{aligned}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\begin{aligned}&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\end{aligned}&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\end{aligned}&#39;</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">              <span class="token comment">// 其他常用符号</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\to&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\to&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\mapsto&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\mapsto&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Rightarrow&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\Rightarrow&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Leftarrow&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\Leftarrow&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string-property property">&#39;\\\\Leftrightarrow&#39;</span><span class="token operator">:</span> <span class="token string">&#39;\\\\Leftrightarrow&#39;</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">processEscapes</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">processEnvironments</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">processRefs</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">tags</span><span class="token operator">:</span> <span class="token string">&#39;ams&#39;</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token literal-property property">options</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token literal-property property">enableMenu</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token operator">...</span><span class="token keyword">this</span><span class="token punctuation">.</span>options<span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">renderActions</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">              <span class="token literal-property property">addMenu</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token literal-property property">checkLoading</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token number">1000</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">,</span> <span class="token string">&#39;&#39;</span><span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">ignoreHtmlClass</span><span class="token operator">:</span> <span class="token string">&#39;tex2jax_ignore&#39;</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token literal-property property">processHtmlClass</span><span class="token operator">:</span> <span class="token string">&#39;tex2jax_process&#39;</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token literal-property property">startup</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token function-variable function">pageReady</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">              <span class="token keyword">return</span> window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span>startup<span class="token punctuation">.</span><span class="token function">defaultPageReady</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">            <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token literal-property property">loader</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token literal-property property">load</span><span class="token operator">:</span> <span class="token punctuation">[</span></span>
<span class="line">              <span class="token string">&#39;[tex]/color&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;[tex]/cancel&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;[tex]/enclose&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;[tex]/mhchem&#39;</span><span class="token punctuation">,</span></span>
<span class="line">              <span class="token string">&#39;[tex]/physics&#39;</span><span class="token punctuation">,</span></span>
<span class="line">            <span class="token punctuation">]</span><span class="token punctuation">,</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">        <span class="token punctuation">}</span><span class="token punctuation">;</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token function">renderMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token keyword">if</span> <span class="token punctuation">(</span>window<span class="token punctuation">.</span>MathJax <span class="token operator">&amp;&amp;</span> window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span>typesetPromise<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token comment">// 先清除之前的渲染，避免重复渲染导致的问题</span></span>
<span class="line">          <span class="token keyword">if</span> <span class="token punctuation">(</span>window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span>typesetClear<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">            window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span><span class="token function">typesetClear</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer<span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">          <span class="token punctuation">}</span></span>
<span class="line">          <span class="token comment">// 确保DOM已更新后再渲染</span></span>
<span class="line">          <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">$nextTick</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">            window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span><span class="token function">typesetPromise</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer<span class="token punctuation">]</span><span class="token punctuation">)</span></span>
<span class="line">              <span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">                console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">&#39;MathJax渲染完成&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">              <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line">              <span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">                console<span class="token punctuation">.</span><span class="token function">error</span><span class="token punctuation">(</span><span class="token string">&#39;MathJax渲染错误:&#39;</span><span class="token punctuation">,</span> err<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">              <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token punctuation">}</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">      <span class="token function">loadMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">        <span class="token keyword">return</span> <span class="token keyword">new</span> <span class="token class-name">Promise</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">resolve</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">          <span class="token keyword">const</span> script <span class="token operator">=</span> document<span class="token punctuation">.</span><span class="token function">createElement</span><span class="token punctuation">(</span><span class="token string">&#39;script&#39;</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">          script<span class="token punctuation">.</span>src <span class="token operator">=</span></span>
<span class="line">            <span class="token string">&#39;https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js&#39;</span><span class="token punctuation">;</span></span>
<span class="line">          script<span class="token punctuation">.</span>async <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">;</span></span>
<span class="line">          document<span class="token punctuation">.</span>head<span class="token punctuation">.</span><span class="token function">appendChild</span><span class="token punctuation">(</span>script<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span>
<span class="line">          script<span class="token punctuation">.</span><span class="token function-variable function">onload</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span></span>
<span class="line">            <span class="token keyword">if</span> <span class="token punctuation">(</span>window<span class="token punctuation">.</span>MathJax <span class="token operator">&amp;&amp;</span> window<span class="token punctuation">.</span>MathJax<span class="token punctuation">.</span>typesetPromise<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">              <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">configureMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">              <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">renderMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">              <span class="token function">resolve</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">            <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span></span>
<span class="line">              <span class="token function">setTimeout</span><span class="token punctuation">(</span>checkMathJax<span class="token punctuation">,</span> <span class="token number">100</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">            <span class="token punctuation">}</span></span>
<span class="line">          <span class="token punctuation">}</span><span class="token punctuation">;</span></span>
<span class="line">        <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">      <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">    <span class="token function">mounted</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token keyword">this</span><span class="token punctuation">.</span>mathContainer <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>$refs<span class="token punctuation">.</span>mathContainer<span class="token punctuation">;</span></span>
<span class="line">      <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">loadMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"></span>
<span class="line">    <span class="token function">updated</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line">      <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">renderMathJax</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line">    <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line">  <span class="token punctuation">}</span><span class="token punctuation">;</span></span>
<span class="line"></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></span>
<span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>style</span> <span class="token attr-name">scoped</span><span class="token punctuation">&gt;</span></span><span class="token style"><span class="token language-css"></span>
<span class="line">  <span class="token selector">.math-container</span> <span class="token punctuation">{</span></span>
<span class="line">    <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token string">&#39;Times New Roman&#39;</span><span class="token punctuation">,</span> serif<span class="token punctuation">;</span></span>
<span class="line">    <span class="token property">line-height</span><span class="token punctuation">:</span> 1.6<span class="token punctuation">;</span></span>
<span class="line">  <span class="token punctuation">}</span></span>
<span class="line"></span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>style</span><span class="token punctuation">&gt;</span></span></span>
<span class="line"></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div>`,4),l=[e];function c(o,i){return a(),s("div",null,l)}const r=n(t,[["render",c],["__file","代码片段 - 解析数学公式.html.vue"]]),k=JSON.parse(`{"path":"/vue%E7%AC%94%E8%AE%B0%E5%8F%8A%E5%91%A8%E8%BE%B9%E7%94%9F%E6%80%81/%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5%20-%20%E8%A7%A3%E6%9E%90%E6%95%B0%E5%AD%A6%E5%85%AC%E5%BC%8F.html","title":"","lang":"zh-CN","frontmatter":{},"headers":[{"level":2,"title":"使用","slug":"使用","link":"#使用","children":[]},{"level":2,"title":"组件代码","slug":"组件代码","link":"#组件代码","children":[]}],"git":{"updatedTime":1755347964000,"contributors":[{"name":"袁果锅","email":"2914310412@qq.com","commits":1}]},"filePathRelative":"vue笔记及周边生态/代码片段 - 解析数学公式.md","excerpt":"<h2>使用</h2>\\n<div class=\\"language-vue\\" data-highlighter=\\"prismjs\\" data-ext=\\"vue\\" data-title=\\"vue\\"><pre class=\\"language-vue\\"><code><span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\">&lt;</span>MathJaxRenderer</span> <span class=\\"token attr-name\\">class</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span>msg aiMsg<span class=\\"token punctuation\\">\\"</span></span> <span class=\\"token attr-name\\">:ref</span><span class=\\"token attr-value\\"><span class=\\"token punctuation attr-equals\\">=</span><span class=\\"token punctuation\\">\\"</span><span class=\\"token punctuation\\">'</span>math' + item.id<span class=\\"token punctuation\\">\\"</span></span><span class=\\"token punctuation\\">&gt;</span></span></span>\\n<span class=\\"line\\">              {{ item.content }}</span>\\n<span class=\\"line\\"><span class=\\"token tag\\"><span class=\\"token tag\\"><span class=\\"token punctuation\\">&lt;/</span>MathJaxRenderer</span><span class=\\"token punctuation\\">&gt;</span></span></span>\\n<span class=\\"line\\"></span></code></pre></div>"}`);export{r as comp,k as data};