如何用react-dnd中的DragLayer组件修复Flow 0.80.0错误?

时间:2018-08-28 16:01:51

标签: javascript flowtype

我将flow-bin0.54.0更新为0.80.0,现在我看到react-dnd库中出现了一些新的Flow错误。一个示例是DragLayer高阶组件。

代码:

// MyCustomDragLayer.jsx
// ----------------------------------------

import { DragLayer } from 'react-dnd'

class MyCustomDragLayer extends Component<Props> {
  // ...
}

export default DragLayer(monitor => ({
  item: monitor.getItem(),
  itemType: monitor.getItemType(),
  initialOffset: monitor.getInitialSourceClientOffset(),
  currentOffset: monitor.getSourceClientOffset(),
  initialClientOffset: monitor.getInitialClientOffset(),
  delta: monitor.getDifferenceFromInitialOffset(),
  isDragging: monitor.isDragging(),
}))(MyCustomDragLayer)



// render() function in a different file
// ----------------------------------------

import DragLayer from './MyCustomDragLayer.jsx'

<DragLayer
  {...{
    prop_one,
    prop_two,
    // etc.
  }}
/>

流错误:

Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ components/foo/bar.jsx:499:10

Cannot create DragLayer element because:
• property currentOffset is missing in props [1] but exists in object literal [2].
• property delta is missing in props [1] but exists in object literal [2].
• property initialClientOffset is missing in props [1] but exists in object literal [2].
• property initialOffset is missing in props [1] but exists in object literal [2].
• property isDragging is missing in props [1] but exists in object literal [2].
• ... 2 more errors.

    components/foo/index.jsx
    496│           }}
    497│         />
    498│
[1] 499│         <DragLayer
    500│           {...{
    501│             prop_one,
    502│             prop_two,
    503│             // etc.
    504│           }}
    505│         />
    506│

    components/foo/bar.jsx
[2] 410│ export default DragLayer(monitor => ({
    411│   item: monitor.getItem(),
    412│   itemType: monitor.getItemType(),
    413│   initialOffset: monitor.getInitialSourceClientOffset(),
    414│   currentOffset: monitor.getSourceClientOffset(),
    415│   initialClientOffset: monitor.getInitialClientOffset(),
    416│   delta: monitor.getDifferenceFromInitialOffset(),
    417│   isDragging: monitor.isDragging(),
    418│ }))(MyCustomDragLayer)

如何解决此Flow错误?

1 个答案:

答案 0 :(得分:0)

是的,我在类似的react-dnd 0.79.1问题(不完全相同)上使用了$ FlowFixMe,因为我无法弄清楚。如果您不能这样做,那可能是某个地方的错误。

对不起,没有太大帮助,只是备份可能不是您。