菜鸟的错误 #2430
Description
- I have searched the issues of this repository and believe that this is not a duplicate.
Version
1.6.1
Environment
省略
Reproduction link
https://www.antdv.com/components/table-cn/#components-table-demo-resizable-column
Steps to reproduce
表格可伸缩里面的实例，一辈子都运行不了
Delete <script> import Vue from 'vue'; import VueDraggableResizable from 'vue-draggable-resizable'; Vue.component('vue-draggable-resizable', VueDraggableResizable); const columns = [ { title: 'Date', dataIndex: 'date', width: 200, }, { title: 'Amount', dataIndex: 'amount', width: 100, }, { title: 'Type', dataIndex: 'type', width: 100, }, { title: 'Note', dataIndex: 'note', width: 100, }, { title: 'Action', key: 'action', scopedSlots: { customRender: 'action' }, }, ]; const data = [ { key: 0, date: '2018-02-11', amount: 120, type: 'income', note: 'transfer', }, { key: 1, date: '2018-03-11', amount: 243, type: 'income', note: 'transfer', }, { key: 2, date: '2018-04-11', amount: 98, type: 'income', note: 'transfer', }, ]; const draggingMap = {}; columns.forEach(col => { draggingMap[col.key] = col.width; }); const draggingState = Vue.observable(draggingMap); const ResizeableTitle = (h, props, children) => { let thDom = null; const { key, ...restProps } = props; const col = columns.find(col => { const k = col.dataIndex || col.key; return k === key; }); if (!col.width) { return {children}; } const onDrag = x => { draggingState[key] = 0; col.width = Math.max(x, 1); }; const onDragstop = () => { draggingState[key] = thDom.getBoundingClientRect().width; }; return ( (thDom = r)} width={col.width} class="resize-table-th"> {children} ); }; export default { name: 'App', data() { this.components = { header: { cell: ResizeableTitle, }, }; return { data, columns, }; }, }; </script> <style lang="less"> .resize-table-th { position: relative; .table-draggable-handle { height: 100% !important; bottom: 0; left: auto !important; right: -5px; cursor: col-resize; touch-action: none; } } </style>What is expected?
修复这鬼东西吧
What is actually happening?
一辈子都没修复