GooglePicker's onChange() function is not being called in React programme

Question

here is my GooglePicker

<GooglePicker clientId={'ClientID'}
                         developerKey={'API Key'}
                         scope={['https://www.googleapis.com/auth/drive.readonly']}
                         onChange={this.onChange}
                         multiselect={true}
                         navHidden={true}
                         authImmediate={false}
                         mimeTypes={['image/png', 'image/jpeg', 'image/jpg']}
                         viewId={'DOCS_IMAGES'}>
               <button type="button" id="pick">Pick File</button>  
            </GooglePicker>

here is my onchange function

onChange() {
       console.log("Change is logged here");
}

I am able to display the picker button and select the file from google drive. But onChange function is not being called. Please let me know the flaw in the code.

Answer 1

Try to send your onChange function like the arrow function:

<GooglePicker clientId={'ClientID'}
                         developerKey={'API Key'}
                         scope={['https://www.googleapis.com/auth/drive.readonly']}
                         onChange={(data) => this.onChange(data)}
                         multiselect={true}
                         navHidden={true}
                         authImmediate={false}
                         mimeTypes={['image/png', 'image/jpeg', 'image/jpg']}
                         viewId={'DOCS_IMAGES'}>
               <button type="button" id="pick">Pick File</button>  
            </GooglePicker>