我需要在两个连续的步骤中在同一页上一个在另一个下面显示相同的表达式。enter image description hereenter image description here带有一个递增计数器的按钮(etape)
在发展过程中,显示是真实的更新的,但某些表达式是在浏览器页面刷新后才解释的,而且在第二步中,数学表达式是不解释的,我对此仍感到不解。
main.js
import { createApp } from 'vue'
import App from './App.vue'
import VueMathjax from 'vue-mathjax-next';
createApp(App).use(VueMathjax).mount('#app')
App.vue
<template>
<div id="app">
<h1>Étape = {{ etape }}</h1>
<h2> Requires page refresh even on initial display </h2>
<div v-if="etape >= 0">
<ul>
<li>
<h3>(E 1) </h3> $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}. $$
</li>
<li>
<h3>(E 2) </h3> \( f(x) = x^2 + 2 x=2 \)
</li>
<li>
<h3>(E 3) </h3> \( P_A(B) = \frac{P(A \cap B)}{ P(A)} \)
</li>
</ul>
<h2> But the following two scriptures are not interpreted </h2>
<ul>
<li>
<h3>(E 4) </h3> $ f(x) = x^2 + 2 \quad \mathrm { if } \quad x=2 $
</li>
<li>
<h3>(E 5) </h3> $ P_A(B) = \frac{P(A \cap B)}{ P(A)} $
</li>
</ul>
<br />
<button @click="etape++"> Presss Next step</button>
</div>
<div v-if="etape >= 1">
<hr>
<h2> second step : Étape = {{ etape }} </h2>
<ul>
<li>
<h3>(E 1) </h3> $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}. $$
</li>
<li>
<h3>(E 2) </h3> \( f(x) = x^2 + 2 x=2 \)
</li>
<li>
<h3>(E 3) </h3> \( P_A(B) = \frac{P(A \cap B)}{ P(A)} \)
</li>
</ul>
<ul>
<li>
<h3>(E 4) </h3> $ f(x) = x^2 + 2 \quad \mathrm { if } \quad x=2 $
</li>
<li>
<h3>(E 5) </h3> $ P_A(B) = \frac{P(A \cap B)}{ P(A)} $
</li>
</ul>
</div>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
etape: 0,
}
}
};
</script>
<style>
</style>
毫无结果的几个小时。缩减为几行来限制问题
1条答案
按热度按时间rdlzhqv91#
我找到了一个变通办法:
应用程序版本: