Nicht aufrufen kann eine Klasse wie eine Funktion, Reagieren router zeigen den Fehler in der Konsole wenn ich mit es6-format
Im mit reagieren router-Erweiterung zu definieren, reagieren Strecken in meiner Anwendung. jedes Ding in Ordnung arbeiten, aber das Problem ist, dass wenn ich es6-syntax zu definieren Klasse App.js
als index.js
"nicht aufrufen kann eine Klasse wie eine Funktion".
wenn ändern App.js
- Datei-format zu App.jsx
es lösen mein Problem.
Wie funktioniert kann ich definieren index.jsx
Datei in .js
es6
format ? oder jede richtige Weg, um dieses Problem zu beheben?
dies sind meine reagieren, router, Datei-und app.js Datei.
Hier ist der github-link zu reagieren-router-Bibliothek
https://github.com/reactjs/react-router
index.jsx
import React from 'react'
import { render } from 'react-dom'
import { Router, Route, browserHistory } from 'react-router'
import App from './app/App'
render((
<Router history={browserHistory}>
<Route path="/" component={App}/>
</Router>
), document.getElementById('app'))
Reagieren nun router-Datei ist
//App.js Datei
import React from 'react';
import { Link } from 'react-router'
class App extends React.createClass{
constructor(props) {
super(props);
}
render() {
return (
<div>
This is a App.js file write in es6.
</div>
)
}
}
export default App;
**Bearbeitet: **
Ich habe folgende webpack loader config
{
test: /(\.js|\.jsx)$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets:['es2015','react']
}
}
Du musst angemeldet sein, um einen Kommentar abzugeben.
Klasse erweitern
React.Component
, nichtReact.createClass
.z.B.
Auf webpack config-Datei und die Suche nach einem babel-loader, dass
test
eine jsx Datei. ändernjsx
zujs
importieren nur das, was Sie brauchen in der Komponente anstelle der gesamten Bibliothek. Beispiel unten
Auch starten, indem Sie env statt es2015 da env unterstützt alle aktuellen ES-Versionen. Dieser ist empfohlen von babel. Installieren babel-preset-env und deinstallieren babel-preset-es2015