reactjs - Error invalid tag SelectField material-ui -
i'm trying insert selectfield component. while other material-ui components work fine, 1 causes following error:
uncaught error: invalid tag: 6ff349240eb3913e56be1f53fb8a0ac4.js @ invariant (app.js:9293) @ validatedangeroustag (app.js:20072) @ new reactdomcomponent (app.js:20099) @ object.createinternalcomponent (app.js:25256) @ instantiatereactcomponent (app.js:23936) @ instantiatechild (app.js:23743) @ app.js:23770 @ traverseallchildrenimpl (app.js:25453) @ traverseallchildrenimpl (app.js:25469) @ traverseallchildrenimpl (app.js:25469)
this code contains selectfield:
import react, {component} 'react' import {connect} 'react-redux' import {reduxform, field} 'redux-form' import {link} 'react-router' import selectfield 'material-ui/selectfield' import menuitem 'material-ui/menuitem' import {button} 'react-bootstrap' const styles = { errorstyle: { color: 'red', marginbottom: '5px' }, submit: { float: 'left' }, title: { textalign: 'center', width: '100%', marginbottom: 10, fontsize: 14, color: '#555' } } const renderselectfield = props => ( <selectfield floatinglabeltext={props.label} onchange={(event, index, value) => props.onchange(value)}> </selectfield> ) class deviceschedule extends component { render() { const {handlesubmit, pristine, submitting} = this.props return ( <form onsubmit={handlesubmit}> <div classname='box-body'> <div classname="row"> <div classname="col-md-4"> <field name="favoritecolor" component={renderselectfield} label="favorite color"> <menuitem value={'ff0000'} primarytext="red"/> <menuitem value={'00ff00'} primarytext="green"/> <menuitem value={'0000ff'} primarytext="blue"/> </field> </div> </div> </div> <div classname='box-footer'> <div style={styles.submit}> <button bsstyle="primary" type="submit" disabled={pristine || submitting}> agendar </button> </div> <div style={styles.submit}> <link to="devices"> <button>cancelar</button> </link> </div> </div> </form> ) } } deviceschedule = reduxform({form: 'deviceschedule', destroyonunmount: false, enablereinitialize: true})(deviceschedule) const mapstatetoprops = state => ({item: state.devices.item, initialvalues: state.devices.item}) export default connect(mapstatetoprops, null)(deviceschedule)
when remove works fine.
these dependecies:
"devdependencies": { "babel-core": "^6.22.1", "babel-loader": "^6.2.10", "babel-plugin-react-html-attrs": "^2.0.0", "babel-plugin-transform-object-rest-spread": "^6.22.0", "babel-preset-es2015": "^6.22.0", "babel-preset-react": "^6.22.0", "css-loader": "^0.26.1", "extract-text-webpack-plugin": "^1.0.1", "file-loader": "^0.9.0", "json-loader": "^0.5.4", "style-loader": "^0.13.1", "webpack": "^1.14.0", "webpack-dev-server": "^1.16.2" }, "dependencies": { "admin-lte": "^2.3.6", "axios": "^0.15.3", "bluebird": "^3.5.0", "classnames": "^2.2.5", "font-awesome": "^4.7.0", "ionicons": "^3.0.0", "jquery": "^3.2.1", "lodash": "^4.17.4", "material-ui": "^0.16.7", "moment": "^2.18.1", "moment-timezone": "^0.5.13", "react": "^15.6.1", "react-bootstrap": "^0.31.1", "react-cookie": "^2.0.7", "react-dom": "^15.6.1", "react-moment": "^0.3.0", "react-redux": "^4.4.6", "react-redux-toastr": "^4.4.2", "react-router": "^3.0.2", "react-router-redux": "^4.0.8", "react-select": "^1.0.0-rc.5", "react-tap-event-plugin": "^2.0.1", "redux": "^3.6.0", "redux-form": "^6.4.1", "redux-form-material-ui": "^4.2.0", "redux-multi": "^0.1.12", "redux-promise": "^0.5.3", "redux-thunk": "^2.1.0", "validator": "^7.1.0" }
would know how solve problem? i've tried in several ways , i'm not trying solve problem.
Comments
Post a Comment