new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data() {
    return {
      value: '$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$',
    };
  },
  
  template: `
  
        <div class="math-jax-container">
          <v-textarea
            v-model="value"
          />
          <div
            id="maththt"
            ref="mathJax"
          >
            {{ value }}
          </div>
        </div>
  `,
  
  watch: {
    value(v) {
      this.renderMathJax();
    },
  },
  
  methods: {
   renderMathJax() {
      window.MathJax.typesetClear([this.$refs.mathJax]);
      window.MathJax.typeset([this.$refs.mathJax]);
    }
  },
})

<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js" async></script>
<div id="app"></div>