dangvanthanh / vue-a11y-katex

Katex Using Vue.js
http://vue-a11y-katex.surge.sh/
MIT License
8 stars 0 forks source link

how to use katex in vueJS ,is there some demo,like the angular-katex #2

Open leoluu opened 5 years ago

leoluu commented 5 years ago

Hi ,how to use katex in vueJS ,is there some demo,like the angular-katex, which allow lable

<!-- Tag element -->
<katex>x^2</katex>

<!-- Attribute -->
<div katex>x^2</div>

<!-- Attribute value -->
<div katex="x^2"></div>

<!-- expr attribute value -->
<katex expr="x^2"></katex>

<!-- Bind to scope
  $scope.tex = {pow: 'x^2'}
  -->
<katex bind="tex.pow"></katex>

<!-- Set display mode -->
<katex expr="x^2" display-mode></katex>
dangvanthanh commented 3 years ago

@leoluu

In Vue.js, you can use such as

<template>
  <div class="app">
    <inline-math :expression="inlinemathExpr" />
    <block-math :expression="blockmathExpr" />
    <element-math :expression="elementmathExpr"/>
  <div>
</template>

<script>
export default {
  data () {
    return {
      inlinemathExpr: 'c = \\pm\\sqrt{a^2 + b^2}',
      blockmathExpr: 'f(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}\\,d\\xi',
      elementmathExpr: `
        <span class="blue">
          Other node $$ \int_2^3 $$
        </span>
        and some <!-- comment --> more text blah. And math with a\
        $$c = \\pm\\sqrt{a^2 + b^2}$$
      `
    }
  }
}
</script>