Объект CreatRef SharePoint Framework не определен

Я новичок в React и фреймворке SharePoint, и я надеюсь, что кто-то может помочь мне с той же проблемой, что и эта публикация -> https://github.com/OfficeDev/office-ui-fabric-react/issues/4733. В основном я создаю веб-часть, которая должна загрузить файл в библиотеку документов. Элемент управления кнопки office-ui-fabric-react не имеет встроенной возможности, но HTMLInputElement имеет. Решение Je-T в приведенной выше ссылке описывает использование кнопки структуры пользовательского интерфейса для передачи события ссылке, созданной для элемента HTMLInput. Для меня это имеет смысл, но на практике это не работает. В основном ссылка fileUploadRef всегда не определена в методах ClickUpload. может ли кто-нибудь помочь мне понять ошибку в приведенном ниже коде. Если у вас есть рабочий пример чего-то подобного, это тоже поможет.

import * as React from "react";
import { IPhotoUploaderProps } from "./IPhotoUploaderProps";
import styles from "./PhotoUploader.module.scss";
import { createRef, IButtonStyles, IconButton, HighContrastSelector, Label, IContextualMenuProps, IIconProps, PrimaryButton, IButtonProps } from 'office-ui-fabric-react';
import Dropzone from 'react-dropzone';
import { Modal, ILayerProps} from 'office-ui-fabric-react';


export class PhotoUploader extends React.Component<IPhotoUploaderProps> {
    constructor(props: IPhotoUploaderProps) {
        super(props);


    }

    private fileUploadRef = createRef<HTMLInputElement>();

    private onDrop = (acceptedFiles) => {
        console.log(acceptedFiles);

    }

    private layerProps: ILayerProps = {eventBubblingEnabled: true};

    private clickUpload() {
        if (this.fileUploadRef.current) {
            this.fileUploadRef.current.click();
        }
    }

    private uploadFile(clickEvent: EventInit) {

    }


    public render(): React.ReactElement<IPhotoUploaderProps> {
        const cancelIcon: IIconProps = { iconName: 'Cancel'};

        return (
            <Modal isOpen={this.props.showModal} onDismiss={this.props.modalCancel}  layerProps={this.layerProps} >  
            <div className={styles.photoUploaderContainer}>
                 <IconButton 
                      iconProps={cancelIcon}
                      onClick={this.props.modalCancel}
                      className={styles.cancelButton}
                 />
                <div className={styles.heading}>Submit a Photo</div>
                <p>
                    You can submit home page banner photos to be seen by <strong>all users company-wide.</strong> All photos are reviewed before
                    use.  If your photo is chosen, your name will appears in the attribution on the home page.
                </p>
                <p>
                    <strong>Do not submit photos you don't want the whole company to see!</strong>
                </p>

               <PrimaryButton onClick={this.clickUpload} title="Upload File">Upload Image</PrimaryButton>
               <input ref={this.fileUploadRef} type="file" accept="application/xml" onChange={this.uploadFile}  />

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