NDataTable和NTree组件能够支持使用插槽渲染吗？

[Char-Ten]

This function solves the problem (这个功能解决的问题)

数据归数据，UI归UI。目前数据表和树组件的自定义结构渲染是采用js而非vue模板去去描述的，而希望可以使用slot插槽渲染的考虑有三点： 1，采用jsx或者js函数渲染对一些vue使用者来说有一定的难度； 2，如果不是对vue3的文档啃得特别熟的话，应该不知道如何在setup函数里面如何访问methods里的方法（getCurrentInstance）； 3，减少数据转换难度

Expected API (期望的 API)

类似这个：

<n-data-table :columns="columns" :data="tableData">
    <template #column-operate="{ row, col }">
      <b-button @click="onDelete(row, col)">删除</b-button>
    </template>
 </n-data-table>

columns里面有个key为"operate"的列，然后可以通过v-slot:column-operate的方式把ui渲染上去。或者用component的is属性在表格里分发不同的组件（在树组件此需求应该会有的）。

目前我试着改了一下n-data-table，可以实现，把slot传进那个cell组件内渲染，不过不清楚会不会导致其他问题，且也不清楚这个feature符不符合native ui的理念

[07akioni]

在 js 层面这么做没问题，但是在 ts 层面这样不会存在任何类型检查，目前 vue 的 slot 没有类型。另外维护成本比较高，我们暂时不打算提供类似的 api。naive-ui 提供的 slot 以简单渲染任务为主，例如 header。

[Char-Ten]

目前vue这块，提供的类型是{[x:string]?:Slot}，本身也是不确定的，因为用户可传可不传嘛，所以还是要加一次类型判断后使用。 那如果说，不加这个key，单纯是一个v-slot:cell渲染呢？

我个人感觉，现在这种js配置的方式去自定义渲染表格内容或者树节点，用vue2合适，用vue3不合适。。。毕竟Vue3搞组合式API，最大的目的是希望数据和界面解耦嘛，那我自然是希望数据的内容，一个useXX函数，返回值里面除了数据，最多就是对数据的增删改查方法，不希望跟页面具体UI交互有关联。但现在使用naiveUI，我不得不在useXX里面关联大量的页面交互。。。

[07akioni]

正是因为类型不确定所以才不是很想搞，如果我们依赖于还没有确定的 API 去吧这个事情做了，如果某天 slot 有了类型就有会出现很多 breaking changes。

关于你说的事情我认为也是有道理的，只是相比于这个功能，我们觉得别的事情更重要、风险更小一些，毕竟开发资源还是很有限的。如果我们的开发资源很多，我们可能选择两种 API 都要，因为本质就是换个写法；如果我们的开发资源有限，我们倾向于选择可维护性更好、更加类型严谨的。

[Char-Ten]

那我这周末试试提个pr？你们看看可不可以？

[07akioni]

那我这周末试试提个pr？你们看看可不可以？

不用了，感谢，暂时不打算加。🙏

[Char-Ten]

好吧。。。。table的还好。。。不过tree组件的话，现在是连一个自定义渲染节点的方式都不提供？QAQ

[07akioni]

好吧。。。。table的还好。。。不过tree组件的话，现在是连一个自定义渲染节点的方式都不提供？QAQ

要提供的，这个正在制作中

[nameJw]

所以能在 NDataTable 表格里面只能是一些简单的内容吗，如果要放图片和文字这种就不行了吗？

[nameJw]

真心觉得在 NDataTable 的 columns 中的render 里面去 用 h() 生成 是一件很麻烦的事

[Mrcxt]

真心觉得在 NDataTable 的 columns 中的render 里面去 用 h() 生成 是一件很麻烦的事

同感，期望能加上插槽

[dodu2014]

期待能支持 slot 渲染

[fudiwei]

毛遂自荐 @skit/x.naive-ui，基于 Naive-UI 二次封装了 DataTable 组件，支持插槽式的写法。