docs: use useMemo in getting image field
This commit is contained in:
parent
f1d16f1260
commit
ea32d6b2c4
@ -44,7 +44,7 @@ The following parameters will be passed to your `react_component` during render:
|
||||
|
||||
```js
|
||||
const PostPreview = ({ widgetFor, entry, collection, fields }) => {
|
||||
const imageField = fields.find((field) => field.name === 'image');
|
||||
const imageField = useMemo(fields.find((field) => field.name === 'image'), [fields]);
|
||||
const imageUrl = useMediaAsset(entry.data.image, collection, imageField, entry);
|
||||
|
||||
return h(
|
||||
@ -63,7 +63,7 @@ CMS.registerPreviewTemplate('posts', PostPreview);
|
||||
import CMS, { useMediaAsset } from '@staticcms/core';
|
||||
|
||||
const PostPreview = ({ widgetFor, entry, collection, fields }) => {
|
||||
const imageField = fields.find((field) => field.name === 'image');
|
||||
const imageField = useMemo(fields.find((field) => field.name === 'image'), [fields]);
|
||||
const imageUrl = useMediaAsset(entry.data.image, collection, imageField, entry);
|
||||
|
||||
return (
|
||||
@ -98,7 +98,7 @@ const PostPreview = ({
|
||||
collection,
|
||||
fields,
|
||||
}: TemplatePreviewProps<Post>) => {
|
||||
const imageField = fields.find((field) => field.name === 'image');
|
||||
const imageField = useMemo(fields.find((field) => field.name === 'image'), [fields]);
|
||||
const imageUrl = useMediaAsset(entry.data.image, collection, imageField, entry);
|
||||
|
||||
return (
|
||||
|
@ -109,7 +109,7 @@ const PostPreview: FC<TemplatePreviewProps<PostPreviewData>> = ({
|
||||
}) => {
|
||||
const dateString = useMemo(() => entry.data.date, [entry.data.date]);
|
||||
|
||||
const imageField = fields.find((field) => field.name === 'image');
|
||||
const imageField = useMemo(fields.find((field) => field.name === 'image'), [fields]);
|
||||
const image = useMediaAsset(entry.data.image ?? '', collection, imageField, entry);
|
||||
|
||||
return (
|
||||
|
Loading…
x
Reference in New Issue
Block a user