varletjs / varlet

A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.
https://varletjs.org/#/en-US/index
MIT License
4.9k stars 618 forks source link

<var-tabs> #1570

Closed logoho closed 5 months ago

logoho commented 6 months ago

question

Snipaste_2024-04-05_18-55-27

请问可以如何解决?谢谢

chouchouji commented 6 months ago

是说滚动包装那个地方,其实包装tab那里没有效果,滚动的是月计划周计划那个tab嘛?

haoziqaq commented 6 months ago

可以尝试在内层 tabs 加入 .stop 阻止 touch 事件冒泡。

logoho commented 6 months ago

是说滚动包装那个地方,其实包装tab那里没有效果,滚动的是月计划周计划那个tab嘛?

一个页面用了两个tabs选项卡,一个是(父组件)月计划周计划,一个是(子组件)包装N组。子组件的包装N组的tab数量超出可以横向滚动选择,但是横向滑动只能滑动父组件的左右切换月计划周计划的内容页

logoho commented 6 months ago

.stop

请问是可以在标签内加么?

logoho commented 6 months ago

目前只能 在(父组件)月计划周计划的TabsItems Props里面设置can-swipe | 是否允许滑动切换 为false

haoziqaq commented 6 months ago
<var-tabs @touchmove.stop v-model:active="category">
  <var-tab :name="i.id" v-for="i in categories?.data ?? []" :key="i.id">{{ i.name }}</var-tab>
</var-tabs>