0
私のJSXは、render()以外の最初の関数、つまりsend()を追加しようとするまでうまくいきました。 ()関数:React component "unexpected token function"
import React from 'react';
import ReactDOM from 'react-dom';
class Lobby extends React.Component {
send: function() {
alert("chat-send button clicked");
},
render() {
return (
<div>
<button onClick={this.send} id="chat-send">Send</button>
</div>
)
};
}
ReactDOM.render(<Lobby />, document.getElementById("chat-pin"));
私は
SyntaxError: /pathname.../file.js: Unexpected token
を言い、その後、キーワード機能がsendから指摘されたエラーを受けています。
私はReactをレンダリングしていたので、何が問題なのでしょうか?ここに私の一気ファイルは私のために力仕事をやっている:
//-----------------------------------------------------------------------------
// gulpfile.js
// Gulp is our task runner. Currently being used to transpile ES6 and React.
//-----------------------------------------------------------------------------
const gulp = require('gulp');
const babelify = require('babelify');
const browserify = require('browserify');
const source = require("vinyl-source-stream");
const buffer = require("vinyl-buffer");
//-----------------------------------------------------------------------------
// Transpile the ES6 and React code.
//-----------------------------------------------------------------------------
gulp.task('js',() => {
return browserify({ entries: ['react-src/LobbyChatReact.js'] })
.transform(babelify, {
presets: ["react", "es2015"],
plugins: ["transform-class-properties"] })
.bundle()
.pipe(source('LobbyChatReact.js'))
.pipe(gulp.dest('public/javascripts/react-build'));
});
//-----------------------------------------------------------------------------
// Listen for changes in react-src folder. When changes detected, transpile.
//-----------------------------------------------------------------------------
gulp.task('default', ['js'],() => {
gulp.watch('react-src/LobbyChatReact.js', ['js']);
});
「反応しない」またはクラスのプロパティをカバー「es2015」プリセットどちらも私の理解だったので、私は「transform-を取得する必要がありますクラス - プロパティ "プラグイン。
ここで間違っていることは誰でも見ることができますか?
'無を避けるためにクラスのメソッドを定義するときに我々は、関数キーワードを追加しない
代わりの
undef'エラーが発生した場合、 'this.send()'で関数を呼び出す必要があります。 –