K
K
K
HHK
KKHKKKHKKKuseTableuseTable@refinedev/react-table@refinedev/react-tablecategoriesgetList_ididgetOnegetManygetManyReferencecreateupdateupdateManydeletedeleteManyimport React from "react";
import { useNavigation } from "@refinedev/core";
import { useTable } from "@refinedev/react-table";
import { ColumnDef, flexRender } from "@tanstack/react-table";
export const CategoryList = () => {
const columns = React.useMemo<ColumnDef<any>[]>(
() => [
{
id: "id",
accessorKey: "id",
header: "Id",
},
{
id: "title",
accessorKey: "title",
header: "Title",
},
{
id: "actions",
accessorKey: "id",
header: "Actions",
cell: function render({ getValue }) {
return (
<div
style={{
display: "flex",
flexDirection: "row",
flexWrap: "wrap",
gap: "4px",
}}
>
<button
onClick={() => {
show("categories", getValue() as string);
}}
>
Show
</button>
<button
onClick={() => {
edit("categories", getValue() as string);
}}
>
Edit
</button>
</div>
);
},
},
],
[],
);
const { edit, show } = useNavigation();
const {
getHeaderGroups,
getRowModel,
setOptions,
refineCore: {
tableQueryResult: { data: tableData },
},
} = useTable({
columns,
});
}import { fetchUtils } from "@refine.dev";
export default {
getList: async ({ resource, pagination, sort, filter }) => {
const { url, options } = fetchUtils.apiGateway({
url: `<https://example.com/${resource}`,>
method: "GET",
});
const { json } = await fetchUtils.fetchJson(url, options);
// Custom parsing of JSON response
const data = json.data.map(item => {
return {
...item,
id: item._id, // For example, if your backend uses _id instead of id
};
});
return {
data,
total: json.total,
};
},
// ...other methods like getOne, getMany, etc.
};