[Vue warn]: Non-function value encountered for default slot. Prefer function slots for better performance.

我们需要在操作列这里使用h来动态创建菜单，在Vue3里报下面的警告

。

如果遇到这个警告， 应该的原因是Vue希望你在渲染自定组件时， 第三个参数是一些插槽内容， 这时候最好提供一个函数， 其返回值作为默认插槽的内容。 可以尝试把h的第三个参数（即内容这个参数加一个匿名函数()=>）例如 () => '按钮'

在嵌入的组件中可以使用$slots.default来指定，如下图所示：

      //1、示例测试
      return h("div", { className: "app" }, [
        h("h2", { className: "title" }, "我是标题" + this.index),
        h("p", null, "我是内容"), this.$slots.default
      ]);

      //2、示例测试
      return h(ElButton, { class: 'el-dropdown-link' }, () => '按钮');

      //3、下拉菜单组件
      let $slots = this.$slots;
      return h(ElDropdown,
        {
          splitButton: true,
          type: 'default',
          size: 'small',
          props: {
            //或者'click'根据需求设置触发方式
            trigger: 'hover',
          }
        },
        {
          default: () => '下拉菜单',
          //指定插槽为dropdown
          dropdown: () => h(ElDropdownMenu, null, {
            default: () => [
              h(ElDropdownItem, { key: 'action-one', onClick: this.handleActionOne }, () => '操作一'),
              h(ElDropdownItem, { key: 'action-one', onClick: this.handleActionOne }, () => '操作二')
            ]
          }),
        });

这样就不会报这个警告了。

参考：Vue3 渲染函数 | 前端程序员-Cloud