useUpdateMany

This hook allows to call dataProvider.updateMany() when the callback is executed, and update an array of records based on their ids and a data argument.

Syntax

const [updateMany, { data, isPending, error }] = useUpdateMany(
 resource,
 { ids, data },
 options
);

The updateMany() method can be called with the same parameters as the hook:

updateMany(
 resource,
 { ids, data },
 options
);

So, should you pass the parameters when calling the hook, or when executing the callback? It’s up to you; but if you have the choice, we recommend passing the parameters when calling the updateMany callback (second example below).

Usage

// set params when calling the hook
import { useUpdateMany, useListContext } from 'react-admin';
const BulkResetViewsButton = () => {
 const { selectedIds } = useListContext();
 const [updateMany, { isPending, error }] = useUpdateMany(
 'posts',
 { ids: selectedIds, data: { views: 0 } }
 );
 const handleClick = () => {
 updateMany();
 }
 if (error) { return <p>ERROR</p>; }
 return <button disabled={isPending} onClick={handleClick}>Reset views</button>;
};
// set params when calling the updateMany callback
import { useUpdateMany, useListContext } from 'react-admin';
const BulkResetViewsButton = () => {
 const { selectedIds } = useListContext();
 const [updateMany, { isPending, error }] = useUpdateMany();
 const handleClick = () => {
 updateMany(
 'posts',
 { ids: selectedIds, data: { views: 0 } }
 );
 }
 if (error) { return <p>ERROR</p>; }
 return <button disabled={isPending} onClick={handleClick}>Reset views</button>;
};

TypeScript

The useUpdateMany hook accepts a generic parameter for the record type and another for the error type:

useUpdateMany<Product, Error>(undefined, undefined, {
 onError: (error) => {
 // TypeScript knows that error is of type Error
 },
 onSettled: (data, error) => {
 // TypeScript knows that data is of type Product[]
 // TypeScript knows that error is of type Error
 },
})

AltStyle によって変換されたページ (->オリジナル) /