Vue.js的优雅菜单工具栏和内容编辑器– vue-file-toolbar-menu

Vue.js的优雅菜单工具栏和内容编辑器– vue-file-toolbar-menu
插件名称 vue-file-toolbar-menu
发布时间 2020年6月5日
插件作者 motla

一个Vue.js组件,用于创建带有HTML内容的编辑器选项的可自定义,多语言,易于样式化,启用触摸的HTML工具栏菜单。

变更日志:

v1.3.0(12/16/2020)

  • 用户现在可以设置菜单元素 id

v1.2.0(12/14/2020)

  • 更新资料

v1.1.3(2020年10月22日)

  • 错误修复“单击后关闭颜色选择器”

v1.1.2(09/21/2020)

  • 分隔符和分隔符样式已移至bar-default-styles.scss
  • 次代码重构

2020年7月16日

  • v1.1.1

v1.1.0(2020年7月8日)

  • 添加了垫片组件
  • 为颜色菜单添加了禁用模式
  • 设置参数menu_height现在可以更改CSS的最大高度
  • 将Vue和Core-JS移至devDependencies

安装和下载:

# NPM
$ npm install vue-file-toolbar-menu --save

基本用法:

1.导入组件。

import VueFileToolbarMenu from 'vue-file-toolbar-menu';

2.将文件工具栏菜单组件添加到模板。

<template>
  <div> 
    <vue-file-toolbar-menu :content="my_menu" /> 
  </div>
</template>

3.注册组件,然后将自己的项目插入组件。

export default {
  components: { VueFileToolbarMenu },
  data () {},
  computed: {
    my_menu () {
      return [
        { text: "Home", menu: [
          { text: "Item 1", click: () => alert("Action 1") },
          { text: "Item 2", click: () => alert("Action 2") }
        ] }, {
          // More Buttons Here
        }
      ]
    }
  }
}