He estado tratando de lograr el segmento de código a continuación, leyendo documentos oficiales de ES6 y otros blogs:
onHomeStoreChange = () => (newState) {
this.setState(newState);
}
Usé esto enlazar. pero parece que Gulp no hace su trabajo correctamente, me sale A semicolon is required after a class property
error, pero incluso después de poner uno this
es todavía undefined
. Aquí hay una parte del archivo gulp que usa transformar.
appBundler
// transform ES6 and JSX to ES5 with babelify
.transform("babelify", {presets: ["es2015", "stage-0", "react"]})
//.transform(babelify.configure({stage: 0}))
.bundle()
.on("error",gutil.log)
.pipe(source("bundle.js"))
.pipe(gulp.dest(buildDestination));
Yo uso reaccionar 0.14.5
y estas son mis dependencias de desarrollo
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babelify": "7.2.0",
"browserify": "^12.0.1",
"gulp": "^3.9.0",
"gulp-if": "^2.0.0",
"gulp-streamify": "^1.0.2",
"gulp-uglify": "^1.5.1",
"gulp-util": "^3.0.7",
"vinyl-source-stream": "^1.1.0"
Estoy confundido y cualquier ayuda sería muy apreciada.
editar - agregar el código de reacción completa
export default class App extends React.Component {
constructor(props) { //put componentWillMount code in constructor
super(props);
//this.bindMethods();
this.state = HomeStore.getState();
}
componentDidMount() {
HomeStore.listen(this.onHomeStoreChange);
}
componentWillUnmount() {
HomeStore.unListen(this.onHomeStoreChange);
}
onHomeStoreChange = (newState) => {
//I had syntax error here
this.setState(newState);
}
render() {
return (
<div>
components will go here
</div>
);
}
bindMethods() {
this.onHomeStoreChange = this.onHomeStoreChange.bind(this);
}
}
Si uso bindMethods () funciona pero no =
Respuestas
2 para la respuesta № 1Usted tiene un conjunto adicional de corchetes. Una función de flecha debe tomar su argumento en el primer conjunto de corchetes:
onHomeStoreChange = (newState) => {
this.setState(newState);
};
El error que estás viendo se debe a que has definido efectivamente onHomeStoreChange
como () => (newState)
, y luego lo siguió con y extra {...}
bloquear.