[Vuejs]-Why mathjax in vue.js 3 Requires refresh on initial display developpement page and not work in step 2

by

0👍

I found a work around :

Apps.vue :

<template>
  <div id="app">
    <h1>Étape = {{ etape }}</h1>
    <h2>
      With vscode, change src, requires page refresh even on initial display
    </h2>
    <div v-if="etape >= 0">
      <ul>
        <li>(E 1) <vue-mathjax :formula="racine" /></li>
      </ul>
      <br />
      <button @click="etape++">Presss Next step</button>
    </div>
    <div v-if="etape >= 1">
      <hr />
      <h2>second step : Étape = {{ etape }}</h2>

      <textarea v-model="proba" />
      <br />
      whith input : <vue-mathjax :formula="proba" /> <br />
      without input :
      <vue-mathjax :formula="fractionSimple" />
    </div>
  </div>
</template>
<script>
export default {
  components: {},
  data() {
    return {
      etape: 0,
      racine: "$ x = {-b \\pm \\sqrt{b^2-4ac} \\over 2a}. $ ",
      proba: "$ P_A(B) = \\frac{P(A \\cap B)}{ P(A)} $",
      fractionSimple: "$ \\frac{1}{2} $",
    };
  },
};
</script>
<style>
</style>

Leave a comment