と呼ばれていない私はNodeJS、JSXとReactJSを使用していると私は、次のクラスを持っている:ReactJSがonSubmit検証が動作しない形成、それが
import React from 'react';
export default class LoginPage extends React.Component {
constructor(props) {
super(props);
this.state = {value: ''};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
console.log("QD");
}
handleChange(event) {
console.log("QDWWQD");
this.setState({value: event.target.value});
}
handleSubmit(event) {
console.log('A name was submitted: ' + this.state.value);
event.preventDefault();
}
render() {
return (
<form onSubmit={this.handleSubmit}>
<input type="submit"/>
</form>
);
}
}
私はすべての入力を削除し、単に送信ボタンを保ちました。これをクリックすると、handleSubmit
関数が呼び出されず、ページが更新されます。 EDIT
:ここに は私server.js
ルーティング一部です:
app.get('*', (req, res) => {
match({ routes, location: req.url }, (err, redirectLocation, renderProps) => {
// in case of error display the error message
if (err) {
return res.status(500).send(err.message);
}
// in case of redirect propagate the redirect to the browser
if (redirectLocation) {
return res.redirect(302, redirectLocation.pathname + redirectLocation.search);
}
// generate the React markup for the current route
let markup;
var bodyClasses;
if (req.session.user === undefined) {
markup = renderToString(<LoginPage/>);
bodyClasses = "login-page";
} else if (renderProps) {
// if the current route matched we have renderProps
markup = renderToString(<RouterContext {...renderProps}/>);
bodyClasses = "sidebar-mini";
} else {
// otherwise we can render a 404 page
markup = renderToString(<NotFoundPage/>);
res.status(404);
}
// render the index template with the embedded React markup
return res.render('index', { markup: markup, bodyClasses: bodyClasses });
});
});
そして、それは場合に役立ちます、ここroutes.js
です:
import React from 'react'
import { Route, IndexRoute } from 'react-router'
import Layout from './components/Layout.react';
import IndexPage from './components/IndexPage.react';
import NotFoundPage from "./components/NotFoundPage.react";
import PropertiesPage from "./components/PropertiesPage.react";
const routes = (
<Route path="/" component={Layout}>
<IndexRoute component={IndexPage}/>
<Route path="proprietati" component={PropertiesPage}/>
<Route path="*" component={NotFoundPage}/>
</Route>
);
export default routes;
EDIT2:
:ここにindex.ejsです<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="adminlte/plugins/jQuery/jquery-2.2.3.min.js"></script>
</head>
<body class="hold-transition skin-blue <%= bodyClasses %>">
<div id="main"><%- markup %></div>
</body>
</html>
本当に?私はJsFiddleで試してみましたが、それはうまくいきました.... http://jsfiddle.net/aasrozqd/ –
問題はどこか他の場所ですか?多分nodejsと? – Mihai
おそらくどこか...コードを提供できますか? –