我正在使用useSelect获取可用的图像大小，然后我想检查图像是否实际具有这些大小，因为可能添加了一些自定义图像大小。

我所做的工作正在进行，但我担心实现不正确，因为这是我第一次使用useSelect。

import { compose } from "@wordpress/compose";
import { useBlockProps } from "@wordpress/block-editor";
import { isBlobURL } from "@wordpress/blob";
import {
    MediaPlaceholder,
    BlockControls,
    MediaUpload,
    MediaUploadCheck,
    InspectorControls,
} from "@wordpress/block-editor";
import {
    Toolbar,
    IconButton,
    PanelBody,
    SelectControl,
} from "@wordpress/components";
const { useSelect } = wp.data;

export function Edit(props) {


    const blockProps = useBlockProps();
    const {
        attributes: { id, alt, url },
        setAttributes,
    } = props;

    
    const imageSizes = useSelect(
        (select) => {
            return {
                imageSizes: select("core/editor").getEditorSettings().imageSizes,
                image: id ? select("core").getMedia(id) : null,
            };
        },
        [id]
    );

    const onSelectImage = ({ id, url, alt }) => {
        setAttributes({ id, url, alt });
    };

    function getImageSizes() {
        const { image } = imageSizes;
        if (!image) return [];
        let options = [];
        const sizes = image.media_details.sizes;
        for (const key in sizes) {
            const size = sizes[key];
            const imageSize = imageSizes.imageSizes.find((size) => size.slug === key);
            if (imageSize) {
                options.push({
                    label: imageSize.name,
                    value: size.source_url,
                });
            }
        }
        return options;
    }

    return (
        <>
            {url && !isBlobURL(url) && (
                <InspectorControls>
                    <PanelBody title="Image Settings">
                        {id && (
                            <SelectControl
                                label="Image size"
                                options={getImageSizes()}
                                onChange={(value) => console.log(value)}
                            />
                        )}
                    </PanelBody>
                </InspectorControls>
            )}
            <div {...blockProps}>
                <div>
                    {url ? (
                        <>
                            <img src={url} alt={alt} />
                            {isBlobURL(url) && <Spinner />}
                        </>
                    ) : (
                        <MediaPlaceholder
                            icon="format-image"
                            onSelect={onSelectImage}
                            onError={onUploadError}
                            accept="image/*"
                            allowedTypes={["image"]}
                        />
                    )}

                </div>
            </div>
        </>
    );
}

export default Edit;