Блог

Я пытаюсь загрузить изображение на amazon s3 с помощью axios и все настроить, но продолжаю получать сообщение об ошибке: TypeError: не удается прочитать свойство ‘props’ undefined. Я использую два файла; uploadProductPage.js и uploadProductPageClassComponent.js . И я использую axios в обоих из них. Вот фрагменты, представляющие интерес для каждого из них. Как я могу заставить это работать? Любая помощь будет очень признательна

uploadProductPage.js:

 const onSubmit = (event, files) => {
        event.preventDefault();

const data = new FormData();// If file selected
  if ( this.props.state.selectedFile ) {data.append( 'profileImage', this.props.state.selectedFile, this.props.state.selectedFile.name );Axios.post( '/api/photo/profile-img-upload', data, {
    headers: {
     'accept': 'application/json',
     'Accept-Language': 'en-US,en;q=0.8',
     'Content-Type': `multipart/form-data; boundary=${data._boundary}`,
    }
   })
    .then( ( response ) => {if ( 200 === response.status ) {
      // If file size is larger than expected.
      if( response.data.error ) {
       if ( 'LIMIT_FILE_SIZE' === response.data.error.code ) {
        this.ocShowAlert( 'Max size: 2MB', 'red' );
       } else {
        console.log( response.data );// If not the given file type
        this.ocShowAlert( response.data.error, 'red' );
       }
      } else {
       // Success
       let fileName = response.data;
       console.log( 'fileName', fileName );
       this.ocShowAlert( 'File Uploaded', '#3089cf' );
      }
     }
    }).catch( ( error ) => {
    // If another error
    this.ocShowAlert( error, 'red' );
   });
  } else {
   // if file not selected throw error
   this.ocShowAlert( 'Please upload file', 'red' );
  }};
 

uploadProductPageClassComponent.js:

 export class UploadProductPage extends Component 
{constructor( props ) {
    super( props );
    this.state = {
        selectedFile: null,
        selectedFiles: null
       }
onSubmit = (event) => {
        event.preventDefault();
 const data = new FormData();// If file selected
                if ( this.state.selectedFile ) {data.append( 'profileImage', this.state.selectedFile, this.state.selectedFile.name );
axios.post( '/api/photo/profile-img-upload000', data, {
                  headers: {
                   'accept': 'application/json',
                   'Accept-Language': 'en-US,en;q=0.8',
                   'Content-Type': `multipart/form-data; boundary=${data._boundary}`,
                  }
                 })
                  .then( ( response ) => {if ( 200 === response.status ) {
                    // If file size is larger than expected.
                    if( response.data.error ) {
                     if ( 'LIMIT_FILE_SIZE' === response.data.error.code ) {
                      this.ocShowAlert( 'Max size: 2MB', 'red' );
                     } else {
                      console.log( response.data );// If not the given file type
                      this.ocShowAlert( response.data.error, 'red' );
                     }
                    } else {
                     // Success
                     let fileName = response.data;
                     console.log( 'fileName', fileName );
                     this.ocShowAlert( 'File Uploaded', '#3089cf' );
                    }
                   }
                  }).catch( ( error ) => {
                  // If another error
                  this.ocShowAlert( error, 'red' );
                 });
                } else {
                 // if file not selected throw error
                 this.ocShowAlert( 'Please upload file', 'red' );
    }