React: onChange घटना मोज़िला और IE में टाइप = फ़ाइल प्रतिक्रिया js/Redux के लिए ट्रिगर नहीं हो रही है

मैं जेएस पर प्रतिक्रिया करने के लिए बहुत नया लड़का हूं। मैं थोड़ा उलझन में हूं कि मोज़िला में इनपुट प्रकार = फ़ाइल एक्शन क्यों काम नहीं कर रहा है और आईई क्रोम में ठीक काम कर रहा है। मुझे नहीं पता कि यह क्यों काम नहीं कर रहा है ... क्या यह एक बग है

 import React from 'react';
        import {connect} from 'react-redux';
        import uuid from 'node-uuid'
        import * as headerAction from '../../Actions/headerActions';
        import * as uploadActions from '../../Actions/uploadActions';
        import * as notificationActions from '../../Actions/notificationActions';
        import shortid from 'shortid'

        class Header extends React.Component{
            static contextTypes = {
                router:React.PropTypes.object
            };

            constructor(props){
                super(props);

                this.Hovered = this.Hovered.bind(this);
                this.UnHovered = this.UnHovered.bind(this);


            }
            UnHovered(){
                this.props.toggleMenu(false);
            }
            uniqueNameAndId(){
                return uuid.v1().replace(/-/g, '');
            }
            //below function not triggered When onChange Event happen But file upload pops up
            handleFileUpload(e){
               //Not working
                 e.preventDefault();
                 this.props.setMainPostId(shortid.generate())

    //Upload for single File not working
                const reader = new FileReader();
               const file = e.target.files;
                console.log(file.length);
                reader.onload = () => {
                    console.log("Hello",file.name)
                };

                let file = e.target.files[0];
                reader.readAsDataURL(file);

        //Upload for Multiple files NOt working
                {/*if(file.length <= 5){*/}
                    {/*for(let i=0;i<file.length;i++){*/}
                //         const Reader = new FileReader();
                //         Reader.onload = () => {
                //             let pushData = {
                //                 postOwnerUsername:null,
                //                 id:this.uniqueNameAndId(),
                //                 name:this.uniqueNameAndId(),
                //                 caption:null,
                //                 blobData:Reader.result
                //             };
                //             console.log(pushData)
                //             this.props.pushtoReducer(pushData)
                //         };
                //         Reader.readAsDataURL(file[i])
                //     }
                //     this.props.removeUploadMenu(false)
                //     this.context.router.push('/upload');
                // }else{
                //     console.log('No Dude')
                //     this.props.popErrorNotification(true,"#FF5D5D","Current Max Photo 5")
                // }




            }
            loggedInMenu(){
                return(
                    <div>

                        <li>Explore</li>
                        <li>My uploads</li>
                        {this.props.toggle.removeUploadMenu ?
                            <li>
                                <label htmlFor="upload-photo">Upload</label>

                                <input onChange={this.handleFileUpload.bind(this)} id="upload-photo" type="file" multiple/>
                            </li>:
                            ""
                        }

                        <li>Profile</li>
                        <li><a href="/logout">Logout</a></li>
                    </div>
                )
            }
            loggedOutMenu(){
                return(
                    <div>
                        <li onClick={()=>this.props.toogleSignInOut(true)}>SignUp/SignIn</li>
                        <li>Explore</li>

                    </div>
                )
            }
            renderMenu(){
                return(
                    <div onMouseLeave={this.UnHovered}>
                        <div  className="dtcen">
                            <div className="dt">

                            </div>
                        </div>

                        <div className="dropdown">

                            {this.props.logInStatus.loginStatus ? this.loggedInMenu():this.loggedOutMenu()}


                        </div>
                    </div>
                )
            }
            Hovered(){

                this.props.toggleMenu(true);
            }
            render(){

               // console.log('From uuis',this.uniqueNameAndId())
                //console.log("Login Status",this.props.toggle.removeUploadMenu)

                return(

                    <header>
                        <div className="logo">
                            <p>Masklor </p>
                        </div>
                        <div className="navtoggle">
                            <div onMouseEnter={this.Hovered} className="triangle">
                                <p>Menu</p>
                            </div>

                            {this.props.toggle.menuToggle ? this.renderMenu() : ""}

                        </div>
                    </header>


                )
            }
        }

        const mapStateToProps = (state) => {
          return{
             toggle:state.toggle,
              logInStatus:state.logInStatus,
              photos:state.photoUpload
          }
        };

        const mapDispatchToProps = (dispatch) => {
            return{
                toggleMenu:bool => dispatch(headerAction.toggleStatus(bool)),
                toogleSignInOut:bool => dispatch(headerAction.toggleSignPop(bool)),
                pushtoReducer:object => dispatch(uploadActions.setPhotosState(object)),
                popErrorNotification:(bool,color,message) => dispatch(notificationActions.popUpNotification(bool,color,message)),
                removeUploadMenu:bool => dispatch(headerAction.removeUploadMenu(bool)),
                setMainPostId:id =>dispatch(uploadActions.setIdforMainPost(id))
            }
        }

        export default connect(mapStateToProps,mapDispatchToProps
)(Header)