Как использовать response-dnd-scrollzone в нашем приложении.?

Question

Я очень новичок в реакции JS. Я должен добавить autoscrolling особенность с компонентом перетаскивания. Вот почему я использую response-dnd-scrollzone. При использовании примера из " https://github.com/azuqua/react-dnd-scrollzone " у меня возникают следующие ошибки:

'Scrollzone' не определено 'ScrollingComponent' присваивается значение, но никогда не используется

Пожалуйста, если кто-нибудь может помочь мне с этим и скажите мне, как использовать это в моем коде. Фрагмент ниже показывает несколько строк моего кода, где я использовал scrollzone.

const DndComponent = DragDropContext(HTML5Backend)(ScheduleBoard);
const ScrollingComponent = withScrolling(ScheduleBoard);
const vStrength = createVerticalStrength(500);
const hStrength = createHorizontalStrength(300);

const zone = (
  <Scrollzone verticalStrength={vStrength} horizontalStrength={hStrength}/>

 
);
  
export default connect(
  mapStateToProps,
  {
    clearErrors,
    getToday,
    setPage,
    getDepartments,
    getTaskList,
    getUnscheduledTasks,
    unscheduleTask,
    putUnscheduleTask,
    rescheduleTask,
    putRescheduleTask,
    mergeTasks,
    putMergeTasks,
    unmergeTasks,
    putUnmergeTasks,
    resizeWindow,
    startLoader,
    startDeptLoader,
    unscheduledFilter,
    createReservationNote,
  }
)(DndComponent);

Answer 1

Вы забыли определить ScrollZone, как сказано в документации response-dnd-scrollzone. Вот основной пример.

import withScrolling, { createVerticalStrength, createHorizontalStrength } from 'react-dnd-scrollzone';

const Scrollzone = withScrolling('ul');
const vStrength = createVerticalStrength(500);
const hStrength = createHorizontalStrength(300);

// zone will scroll when the cursor drags within
// 500px of the top/bottom and 300px of the left/right
const zone = (
  <Scrollzone verticalStrength={vStrength} horizontalStrength={hStrength}>

  </Scrollzone>
);