Skip to content

deming1990/math-editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

数学公式编辑器

基于vue框架数学公式编辑器

math-editor

特性: 1、支持中文输入 2、字母、数字为斜体 3、支持常见数学、几何符号,支持符号内部嵌套公式 4、支持文本换行、支持数据导入导出

引用

# 开发版
import Vue from 'vue'
import MathEditor from 'vue-math-editor'
import 'vue-math-editor/dist/math-editor.css'

// 在调用 new Vue() 启动应用之前执行
Vue.use(MathEditor)

使用示例

<!--  
  mode: edit 编辑模式 preview 预览模式 html 预览模式(html)
  height 高度
  normalFontSize 一级字体大小 (html模式下字体大小源于输入时字体大小)
  smallFontSize 二级字体大小 (html模式下字体大小源于输入时字体大小)
-->
<template>
    <math-editor
        :mode="'edit' || 'preview' || 'html'"
        :height="'180px'"
        :normalFontSize="20"
        :smallFontSize="20"
        ref="mathTextEditor">
    </math-editor>
</template>
// 获取公式编辑器数据
const data = this.$refs.mathTextEditor.getValue()
// 设置公式编辑器的数据
this.$refs.mathTextEditor.setValue(data)

参数 && 方法

参数 说明 类型 可选值 默认值
mode 编辑器模式:编辑模式、预览模式,
预览模式无法编辑
string edit / preview / html preview
height 编辑器高度 string - 100%
normalFontSize 文本字体大小 number - 16
smallFontSize 角标字体大小,
例如平方的指数部分
number - 16
textAreaWidth 编辑器输入框宽度 string - -
方法 方法定义 参数 参数说明
getValue 获取公式编辑器的内容数据 - -
setValue 设置公式编辑器的内容数据 string 公式编辑器的内容数据是具有一定的格式JSON,
因此setValue的数据只能来自getValue获取到的数据
getHtml 获取公式编辑器的HTML - -
setHtml 设置公式编辑器的HTML - -

About

math-editor

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages