react-file-input
react-file-input copied to clipboard
Uncaught TypeError: React.createClass is not a function
app.js:37554 Uncaught TypeError: React.createClass is not a function
at Object../node_modules/react-file-input/lib/index.js (app.js:37554)
at __webpack_require__ (app.js:20)
at Module../resources/js/components/PageAdd.js (app.js:53894)
at __webpack_require__ (app.js:20)
at Module../resources/js/pages/car/CarAdd.js (app.js:56941)
at __webpack_require__ (app.js:20)
at Module.<anonymous> (app.js:56019)
at Module../resources/js/pages/App.js (app.js:56198)
at __webpack_require__ (app.js:20)
at Object../resources/js/app.js (app.js:52640)
./node_modules/react-file-input/lib/index.js @ app.js:37554
__webpack_require__ @ app.js:20
./resources/js/components/PageAdd.js @ app.js:53894
__webpack_require__ @ app.js:20
./resources/js/pages/car/CarAdd.js @ app.js:56941
__webpack_require__ @ app.js:20
(anonymous) @ app.js:56019
./resources/js/pages/App.js @ app.js:56198
__webpack_require__ @ app.js:20
./resources/js/app.js @ app.js:52640
__webpack_require__ @ app.js:20
0 @ app.js:59904
__webpack_require__ @ app.js:20
(anonymous) @ app.js:84
(anonymous) @ app.js:87
Api needs update something like
import React from 'react';
import ReactDOM from 'react-dom';
import DOM from 'react-dom-factories';
class FileInput extends React.Component {
getInitialState() {
return {
value: '',
styles: {
parent: {
position: 'relative'
},
file: {
position: 'absolute',
top: 0,
left: 0,
opacity: 0,
width: '100%',
zIndex: 1
},
text: {
position: 'relative',
zIndex: -1
}
}
};
}
handleChange(e) {
this.setState({
value: e.target.value.split(/(\\|\/)/g).pop()
});
if (this.props.onChange) this.props.onChange(e);
}
render(){
return DOM.div({
style: this.state.styles.parent
},
// Actual file input
DOM.input({
type: 'file',
name: this.props.name,
className: this.props.className,
onChange: this.handleChange,
disabled: this.props.disabled,
accept: this.props.accept,
style: this.state.styles.file
}),
// Emulated file input
DOM.input({
type: 'text',
tabIndex: -1,
name: this.props.name + '_filename',
value: this.state.value,
className: this.props.className,
onChange: function() {},
placeholder: this.props.placeholder,
disabled: this.props.disabled,
style: this.state.styles.text
}));
}
};
export {FileInput};