naive ui的NPopconfirm组件在渲染函数h()中的用法

1.PopComfirm简介

       利用Popcomfirm可以很方便的加在按钮等需要点击事件的地方加入确认弹框。

2.PopComfirm的正常使用

       官网提供的Popcomfirm模板代码的使用方法。

3.PopComfirm在渲染函数h()中的用法

       在碰到需要利用h()函数时的情况时，如何使用PopComfirm。

3.1翻看官方文档

       官方文档中提供了Popconfirm Props，Popconfirm Slots和Popconfirm Methods三个接口。
       在Popconfirm Props可以修改PopComfirm的样式，Popconfirm Slots则为Popconfirm Props的插槽，有action、default和icon三个属性（不重要），可以在Popver中查看重要的属性。
       其中trigger的说明为触发弹出信息的组件或元素，所以在这里可以放触发弹窗的按钮等元素。对footer、header和default进行设置可以更改弹窗头部，弹窗内容等信息。
       因此渲染函数h()中使用NPopconfirm组件可以根据上述属性进行设置。

3.2代码

 return h(
      NPopconfirm,
      {
        positiveButtonProps: {
          size: 'tiny',
          color: '#007293',
          bordered: true,
        },
        negativeButtonProps: {
          size: 'tiny',
          color: '#007293',
          bordered: true,
        },
        onPositiveClick: (e: any) => {
          deltree(option.key), e.stopPropagation(), e.preventDefault()
        }
      },
      {
        trigger: () => {
          return h(
            NButton,
            {
              text: true,
              type: 'info',
              color: '#00EAFF',
              size: 'tiny'
            },
            { default: () => '删除' }
          )
        },
        default: () => {
          return '确认删除该节点？'
        }
      }
    )