nutui icon indicating copy to clipboard operation
nutui copied to clipboard

Tabs 选项卡切换-自定义标签栏

Open momtboy opened this issue 1 year ago • 4 comments

What problem does this feature solve?(这个功能解决的问题)

使用自定义标签栏,并开启了title-scroll,标签栏无法自动滚动。

What does the proposed API look like?(期望的 API)

期望可以提供一个 scrollTo 的方法,滚动到指定的标签页;参考 https://vant-ui.github.io/vant/#/zh-CN/tab#tabs-fang-fa

momtboy avatar Jun 06 '23 13:06 momtboy

在使用自定义标签栏时,整个导航栏都是由外部传入的,Tabs 组件内难以实现对它的滚动的控制

eiinu avatar Jun 08 '23 06:06 eiinu

了解,不过这确实是实际应用中很需要的一个功能,可以参考一下 vant 的实现原理嘛,https://github.com/youzan/vant/blob/main/packages/vant/src/tabs/Tabs.tsx

momtboy avatar Jun 09 '23 01:06 momtboy

了解,不过这确实是实际应用中很需要的一个功能,可以参考一下 vant 的实现原理嘛,https://github.com/youzan/vant/blob/main/packages/vant/src/tabs/Tabs.tsx

NutUI 的「自定义标签栏」功能指的是提供整个标签导航区域的插槽,其代码结构、激活滚动等样式完全由开发者控制,通过设置 v-model 来实现 tab-pane 的切换。 标签栏不由组件控制,无法实现 scrollTo 的效果

Vant 的「自定义标签」是指在每个标签中通过插槽定义 title 节点,标签栏是在组件内部渲染的,可以实现控制

是两个不同的功能,从实现方式与用法上都有很大差别。

后续可以增加「自定义标签」这种形式的功能。

eiinu avatar Jun 09 '23 01:06 eiinu

+1,这种功能很常见,很需要,因为使用非自定义的标签栏太限制 了,比如我想加个未读红点提示都没有,这也是很常见的功能,但是自定义的又不能使用-滚动到指定的标签页-官方封装的这种功能,这样就搞的整个组件都不好用了,要自己重新写

hejuan-moon avatar May 30 '24 09:05 hejuan-moon