Как управлять сортируемым состоянием итератора в Reaction-Admin? - PullRequest
Новая
       6

Как управлять сортируемым состоянием итератора в Reaction-Admin?

0 голосов
/ 16 апреля 2019

Я пишу пользовательский итератор, который поддерживает перетаскивание для изменения порядка в списке.Я не уверен, как я могу обновить порядок admin / resources / xxx / data.

Я пытался установить состояние компонента из реквизита, но так как response-admin везде использует cloneElement, он очень хрупкий.

теперь код выглядит следующим образом: 

const Sortable = props => (
  <Datagrid {...props} body={<SortableBody />} />
)

const SortbaleBody = connect({null, {dispatchSortableUpdate}})((props) => (
  const sortable = useMemo(() => Object.values(props.data), [data]);
  const moveRecord = (newData) => {
    dispatchSortableUpdate({data: newData})
  }
  return (
    <DragDropContextProvider backend={HTML5Backend}>
      <TableBody>
        {sortable.map((record, index) => React.cloneElement(SortableRow, props, children))}
      </TableBody>
    </DragDropContextProvider>
  )
))

Это пример сортируемой реагирования: https://codesandbox.io/embed/github/react-dnd/react-dnd/tree/gh-pages/examples_js/04-sortable/simple?fontsize=14

Как я могу обновить порядок admin / resources/ ххх / данные?Я делаю Sortable правильно?

1 Ответ

0 голосов
/ 16 апреля 2019

Я использую 

const sortable = useMemo(() => Object.values(data).sort((a,b) => a.position - b.position))

const moveRecord = (dragIndex, hoverIndex) => {
  const dragRecord = sortable[dragIndex];
  const hoverRecord = sortable[hoverIndex];

  dragRecord.position = hoverIndex + 1;
  hoverRecord.position = dragIndex + 1;
  dispatchSortableUpdate({ id: dragRecord.id, data: dragRecord });
  dispatchSortableUpdate({ id: hoverRecord.id, data: hoverRecord });
}

const sortableUpdate = ({ id, data }) => ({
  type: SORTABLE_UPDATE,
  payload: {
    id,
    data,
  },
  meta: {
    resource: 'xxx',
    fetchResponse: UPDATE,
    fetchStatus: FETCH_END,
  },
});
...