Mint UI 调色板按钮-Palette Button

调色板按钮

引入

import { PaletteButton } from 'mint-ui';

Vue.component(PaletteButton.name, PaletteButton);

例子

基本用法

<mt-palette-button content="+">
  <div class="my-icon-button"></div>
  <div class="my-icon-button"></div>
  <div class="my-icon-button"></div>
</mt-palette-button>

设置参数和事件，以及手动触发事件

methods: {
  main_log(val) {
    console.log('main_log', val);
  },
  sub_log(val) {
    console.log('sub_log', val);
    this.$refs.target_1.collapse();
  }
}

<mt-palette-button content="+" @expand="main_log('expand')" @expanded="main_log('expanded')" @collapse="main_log('collapse')"
  direction="rt" class="pb" :radius="80" ref="target_1" mainButtonStyle="color:#fff;background-color:#26a2ff;"
  style="left:30px;">
  <div class="my-icon-button indexicon icon-popup" @touchstart="sub_log(1)"></div>
  <div class="my-icon-button indexicon icon-popup" @touchstart="sub_log(2)"></div>
  <div class="my-icon-button indexicon icon-popup" @touchstart="sub_log(3)"></div>
</mt-palette-button>

选项

方法

事件