在 vuedraggable@next 中 NButton 无法使用

[Air-Cooled]

TuSimple/naive-ui version (版本)

2.28.2

Vue version (Vue 版本)

3.2.25

Browser and its version (浏览器及其版本)

Chrome( 100.0.4896.127)

System and its version (系统及其版本)

win 10

Node version (Node 版本)

v16.13.2

Reappearance link (重现链接)

https://github.com/SortableJS/vue.draggable.next

Reappearance steps (重现步骤)

<draggable v-model="list"  item-key="id">
  <template #item="{element}">
      <n-button> {{element.name}} </n-button>
  </template>
</draggable>

Expected results (期望的结果)

点击 button 可以进行拖拽

Actual results (实际的结果)

点击 button 无法拖拽，
换为 div 即可拖拽，但在 div 内 button 上点击依旧无法进行拖拽

Remarks (补充说明)

[07akioni]

这个问题你可以给 vuedraggable 提 issue

[Air-Cooled]

这个问题你可以给 vuedraggable 提 issue

element-plus 的 button 是可以正常使用的，确定不是 naive-ui 的问题？

[07akioni]

这个问题你可以给 vuedraggable 提 issue

element-plus 的 button 是可以正常使用的，确定不是 naive-ui 的问题？

一般来说，一个库（比如 draggable）要如果选择接受第三方的组件，这个库就要处理第三方的组件对应的实现。如果功能不能正常运作的话，多数情况是这个库没有处理一些边界情况。

你要看谁是这个功能的实现方，比如点击功能是 naive 实现的，那么你来提一个 bug 肯定会优先看，但是这个功能不是 naive 实现的，所以优先应该让 draggable 去看为什么它对于某些组件不生效。

如果 draggable 指出是 naive 的某些实现导致他们的实现不生效了，那么之后是可以评估一下究竟是不是需要改一下 naive 的实现。

[lakca]

mousedown阻止默认事件导致dragstart不会触发。

@07akioni 为啥这块需要preventDefault()，https://github.com/TuSimple/naive-ui/blob/main/src/button/src/Button.tsx#L157。

如果真的必须的话，可以放在https://github.com/TuSimple/naive-ui/blob/main/src/button/src/Button.tsx#L161里面。

[07akioni]

https://github.com/TuSimple/naive-ui/blob/main/src/button/src/Button.tsx#L157

我也记不太清了

mousedown阻止默认事件导致dragstart不会触发。

@07akioni 为啥这块需要preventDefault()，https://github.com/TuSimple/naive-ui/blob/main/src/button/src/Button.tsx#L157。

如果真的必须的话，可以放在https://github.com/TuSimple/naive-ui/blob/main/src/button/src/Button.tsx#L161里面。

因为不 preventDefault 的话 button 点击后无法在 safari 被聚焦

[07akioni]

加了一个属性可以关掉这个行为