MediaUpload component is not displayed in the theme settings page

I’m developing a WordPress theme settings page using React and there is a file upload function in this page. But the upload button cannot be displayed in the page, and there is no error reported by checking the console. But if I import this component into the Gutenberg editor, the component can be displayed normally.

import { MediaUpload, MediaUploadCheck } from '@wordpress/block-editor';

export const MyMediaUploader = () => {
    const onFileSelect = ( x ) => {
        console.log( x );
    };
    return (
        <>
            <div>upload</div>
            <MediaUploadCheck>
                <MediaUpload
                    onSelect={ onFileSelect }
                    allowedTypes={ [ 'image' ] }
                    value={ 1 }
                    render={ ( { open } ) => {
                        return <button onClick={ open }>Choose image</button>;
                    } }
                />
            </MediaUploadCheck>
        </>
    );
};

I use MediaPlaceholder component in this setting page, I am prompted that I do not have permission to upload files. But I’m logged in with my admin account. My theme setting page is implemented using the rest api.