iview 在Table组件中使用Poptip组件

Question

以上是element的组件效果，
准备使用iview却不知道如何实现这个效果

以下代码能弹出但是Poptip组件按钮没效果，求助

    columns: [{
        title: '产品图',
        key: 'pic',
        sortable: true,
        render: function(h, para){
            return h('div', [
                h('Button', [
                    h('Poptip', {
                        props: {
                            confirm: true,
                            title: '确定要删除吗！',
                            type: 'error',
                            size: 'small'
                        },
                        on: {
                            ok: function(){
                                alert('删除按钮，没效果')
                            },
                            cancel: function(){
                                alert('取消按钮，没效果')
                            }
                        }
                    }, '删除')
                ])
            ]);
        }
    }]

Answer 1

后面再试了一下
方法上面加个'on-ok'就可以执行了

    columns: [{title: '产品图',
    key: 'pic',
    sortable: true,
    render: function(h, para){
        return h('div', [
            h('Button', [
                h('Poptip', {
                    props: {
                        confirm: true,
                        title: '确定要删除吗！',
                        type: 'error',
                        size: 'small'
                    },
                    on: {
                        'on-ok': function(){
                            alert('删除按钮，有效果')
                        },
                        'on-cancel': function(){
                            alert('取消按钮，有效果')
                        }
                    }
                }, '删除')
            ])
        ]);
    }
}]

Answer 2

    columns: [{title: '产品图',
    key: 'pic',
    sortable: true,
    render: function(h, para){
        return h('div', [
            h('Button', [
                h('Poptip', {
                    props: {
                        confirm: true,
                        title: '确定要删除吗！',
                        type: 'error',
                        size: 'small'
                    },
                    on: {
                        'on-ok': function(){
                            this.$Message.info('点击了确定')
                        },
                        'on-cancel': function(){
                            this.$Message.info('点击了确定')
                        }
                    }
                }, '删除')
            ])
        ]);
    }
}]

请问在'on-ok': function(){使用this.$Message.info('点击了确定')报错Error in event handler for "on-ok": "TypeError: Cannot read property '$Message' of null",怎么解决呀？？在线等，急，谢谢

Answer 3

使用=>操作符，修改后代码如下：

 columns: [{title: '产品图',
    key: 'pic',
    sortable: true,
    render: function(h, para){
        return h('div', [
            h('Button', [
                h('Poptip', {
                    props: {
                        confirm: true,
                        title: '确定要删除吗！',
                        type: 'error',
                        size: 'small'
                    },
                    on: {
                        'on-ok': ()=>{
                            this.$Message.info('点击了确定')
                        },
                        'on-cancel': ()=>{
                            this.$Message.info('点击了确定')
                        }
                    }
                }, '删除')
            ])
        ]);
    }