前端那些事20240116-前端那些事-avue2操作栏筛选按钮

<avue-crud :data="data" :option="option" >
  <template slot-scope="{row}" slot="menuBtn">
     <el-dropdown-item divided @click.native="tip(row)">自定义按钮</el-dropdown-item>
  </template>
  <template slot-scope="{row}" slot="menu" >
     <el-button style="margin-left:10px;" size="small" type="text" icon="el-icon-user" @click.native="tip(row)">自定义按钮</el-button>
  </template>
</avue-crud>

<script>
export default {
 data() {
      return {
        data: [
          {
            name:'张三',
            sex:'男'
          }, {
            name:'李四',
            sex:'女'
          }, {
            name:'王五',
            sex:'女'
          }, {
            name:'赵六',
            sex:'男'
          }
        ],
        option:{
          menuType:'menu',
          menuBtnTitle:'自定义名称',
          column:[
             {
              label:'姓名',
              prop:'name'
            },
            {
              label:'性别',
              prop:'sex'
            }
          ]
        }
      }
    },
    methods: {
      tip(row){
        this.$message.success('自定义按钮'+ JSON.stringify(row));
      }
    }
  }
</script>