[Client] Wrap formula component to split code
This commit is contained in:
parent
23d8235197
commit
cc7de853b4
|
@ -0,0 +1,26 @@
|
||||||
|
<template>
|
||||||
|
<span v-html="compiledFormula"></span>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import Vue from 'vue';
|
||||||
|
import * as katex from 'katex';
|
||||||
|
|
||||||
|
export default Vue.extend({
|
||||||
|
props: {
|
||||||
|
formula: {
|
||||||
|
type: String,
|
||||||
|
required: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
compiledFormula(): any {
|
||||||
|
return katex.renderToString(this.formula);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
@import "../../../../../../node_modules/katex/dist/katex.min.css";
|
||||||
|
</style>
|
|
@ -1,26 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<span v-html="compiledFormula"></span>
|
<x-formula :formula="formula"/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import * as katex from 'katex';
|
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
|
components: {
|
||||||
|
XFormula: () => import('./formula-core.vue').then(m => m.default)
|
||||||
|
},
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
formula: {
|
formula: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
compiledFormula(): any {
|
|
||||||
return katex.renderToString(this.formula);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
@import "../../../../../../node_modules/katex/dist/katex.min.css";
|
|
||||||
</style>
|
|
||||||
|
|
Loading…
Reference in New Issue