LWC file upload issue

I use the sample below to do the upload file in LWC:

html:

<template>
  <lightning-file-upload
        label="Attach receipt"
        name="fileUploader"
        accept={acceptedFormats}
        record-id={myRecordId}
        onuploadfinished={handleUploadFinished}
        multiple>
  </lightning-file-upload>
</template>

js：

import { LightningElement, api } from 'lwc';
export default class MyComponentName extends LightningElement {
@api
myRecordId;

get acceptedFormats() {
    return ['.pdf', '.png'];
 }

handleUploadFinished(event) {
    // Get the list of uploaded files
    const uploadedFiles = event.detail.files;
    alert("No. of files uploaded : " + uploadedFiles.length);
 }
}

But when I push to org., it cannot click the upload file button. May I know what causing this issue?