zoukankan      html  css  js  c++  java
  • Vue+iview在render函数中添加Poptip提示操作

    前言:在项目中用到的表格插件中,在最后一栏的‘操作’中我设置了‘编辑’和‘删除’按钮,那么在选择某条数据删除的时候不仅要检查是否选中,提示是否删除还是很有必要的

    1.没加Poptip之前是这样写的:

    {
    title: '操作',
    key: 'action',
    150,
    align: 'center',
    render: (h, params) => {
    return h('div', [
    h('Icon', {
    class: 'deleteHover',
    props: {
    type: 'md-trash'
    },
    attrs: {
    title: '删除'
    },
    on: {
    click: () => {
    this.remove(params.row)
    }
    }
    }, '删除')
    ]);
    }
    }
    2.加Poptip后这样写:

    {
    title: '操作',
    key: 'action',
    150,
    align: 'center',
    render: (h, params) => {
    return h('div', [
    h('Poptip', {
    props: {
    placement: 'left-start',
    confirm: true,
    transfer: true,
    title: '确定删除吗?',
    },
    on: {
    'on-ok': () => {
    this.remove(params)
    },
    'on-cancel': () => {
    }
    }
    }, [
    h('Icon', {
    class: 'deleteHover',
    props: {
    type: 'md-trash'
    },
    attrs: {
    title: '删除'
    },
    style: {
    cursor: 'pointer'
    },
    on: {
    click: () => {
    }
    }
    }, '删除')
    ])
    ]);
    }
    }
     

  • 相关阅读:
    文字对战小游戏~~~
    面向对象--类库、委托、is和as运算符、泛型集合
    推箱子
    算法训练 K好数
    用memset设置无穷大无穷小
    算法训练 关联矩阵
    未名湖边的烦恼
    数字三角形
    算法训练 最大最小公倍数
    算法训练 区间k大数查询
  • 原文地址:https://www.cnblogs.com/guandekuan/p/12563949.html
Copyright © 2011-2022 走看看