vue mathlive下载 - vue mathlive源代码下载

vue mathlive

其他资源

1.0.0

下载

屏幕截图

Mathlive Vue包装器提供了实现<mathlive-mathfield> HTML标签的VUE组件。

该组件可用于使用数学库编辑公式。编辑器提供了丰富，易于访问的编辑UI，包括移动设备的虚拟键盘，并可以将输出作为乳胶，MathML或口语文本提供。

入门

数学库必须单独加载。这提供了选择包装器使用的特定版本的特定版本。

接下来，应导入包装器，然后使用Vue.use()连接两个

注意：此存储库仅包含样本。 Vue包装器包装在主数学库中。

注意：如果您在实例化Mathfield组件时会遇到运行时错误，并从VUE中发出警告runtimeCompiler: true请注意“您正在使用vue的仅运行时构建...”。

 < script type =" module " >
  import * as MathLive from "https://unpkg.com/mathlive/dist/mathlive.min.mjs" ;
  import VueMathfield from "https://unpkg.com/mathlive/dist/vue-mathlive.mjs" ;

  Vue . use ( VueMathfield , MathLive ) ;
</ script >

Mathfields的默认标签是<mathlive-mathfield>可以使用以下方式定义自定义标签：

 Vue . component ( "custom-tag" , Mathfield ) ;

该组件支持v-model属性。

元素的文本内容用作编辑器的初始值。

可以使用:options属性来配置Mathfield，例如指定字体目录的位置。阅读有关可用选项的更多信息。

 < mathlive-mathfield
  :options =" {smartFence:false} "
  @focus =" ping "
  :on-keystroke =" displayKeystroke "
  v-model =" formula "
>
  f(x)=
</ mathlive-mathfield >

道具

姓名	类型	描述
`value`	`string`	Mathfield的内容表示为乳胶字符串。
`options`	`object`	Mathfield的配置选项。
`onKeystroke`	`(keystroke:string, ev:Event) => boolean`	按下键时调用回调。 `keystroke`是一个描述击键的字符串， `ev`是本机键盘事件。返回false以停止处理活动
`onMoveOutOf`	`(string) => boolean`	当键盘导航会导致插入点离开Mathfield时，调用了回调。该参数指示导航的方向，要么“向后”或“向后”。返回false以防止移动，将其置换到字段的开始。默认情况下，插入点会缠绕。
`onTabOutOf`	`(string) => boolean`	按下选项卡（或换档）时调用回调，会导致插入点离开Mathfield。该参数指示导航的方向，要么“向后”或“向后”。返回false以防止移动，将其置换到字段的开始。默认情况下，插入点会缠绕。

事件

姓名	描述
`focus`	编辑实例获得了输入焦点。
`blur`	编辑器实例失去了输入焦点。
`input`	Mathfield的内容已更改。事件的参数是新值作为字符串
`selection-will-change`	Mathfield的选择即将改变
`undo-state-will-change`	撤消状态即将改变
`undo-state-did-change`	撤消状态已经改变
`virtual-keyboard-toggle`	虚拟键盘的可见性发生了变化。第一个参数是布尔值，指示现在是否可见键盘。第二个参数是包含虚拟键盘的DOM元素。
`read-aloud-status`	读取操作的状态已更改。第一个参数是指示新状态的字符串。

方法

姓名	描述
`perform(selector:string)`	如选择器所示，执行动作。
`hasFocus(): boolean`	如果Mathfield专注于Mathfield
`focus()`	将重点放在Mathfield
`blur()`	从Mathfield中删除焦点
`text(format:string): string`	将Mathfield的内容返回指定格式的字符串： `"latex"` ， `"latex-expanded"` （所有乳胶宏都扩展到其定义）， `"spoken"` ， `"mathML"`
`selectedText(format:string): string`	喜欢`text()` ，但仅用于当前选择。
`insert(content:string, options:object)`	`options.insertionMode` = `'replaceSelection'` （默认）， `'replaceAll'` ， `'insertBefore'` ， `'insertAfter'` `options.selectionMode` - Describes where the selection will be after the insertion: `'placeholder'` : the selection will be the first available placeholder in the item that has been inserted) (default), `'after'` : the selection will be an insertion point after the item that has been inserted, `'before'` : the selection will be an insertion point before the item that has been inserted) or 'item' (the item that was inserted will be selected). `options.placeholder`持有人 - 占位符，如有必要 `options.format`字符串`s` ： `'auto'`的格式：字符串被解释为乳胶片段或命令）（默认）， `'latex'` ：该字符串严格解释为乳胶片段 `options.smartFence`如果是真的，请宣传普通围栏，例如`(`如`left...right`或`mleft...mright` `options.suppressChangeNotifications`如果不确定，则不会调用ContentDidchange和selectionDidChange通知的处理程序。默认`false` 。
`keystroke(keys:string, evt:Event)`	模拟用户按键组合
`typedText(text:string)`	模拟用户键入一些文本。
`selectionIsCollapsed():boolean`	如果选择崩溃，则为the，即单插入点
`selectionDepth():number`	返回选择组的深度。如果选择位于根级别，则返回0。如果选择是分数的分子的一部分，则在根级别，返回1。请注意，在这种情况下，分子将是“选择组”
`selectionAtStart():boolean`	如果选择在选择组的开头开始，则返回true
`selectionAtEnd():boolean`	如果选择扩展到选择组的末尾，则返回true
`select()`	选择Mathfield的内容