मैं अंतिम संस्करण प्रतिक्रिया-राउटर मॉड्यूल का उपयोग कर रहा हूं, जिसका नाम प्रतिक्रिया-राउटर-डोम है, जो रिएक्ट के साथ वेब एप्लिकेशन विकसित करते समय डिफ़ॉल्ट हो गया है। मैं जानना चाहता हूं कि पोस्ट अनुरोध के बाद पुनर्निर्देशन कैसे किया जाए। मैं यह कोड बना रहा हूं, लेकिन अनुरोध के बाद भी कुछ नहीं होता है। मैं वेब पर समीक्षा करता हूं, लेकिन सभी डेटा प्रतिक्रिया रूटर के पिछले संस्करणों के बारे में हैं, और अंतिम अपडेट के साथ नहीं।
कोड:
import React, { PropTypes } from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter } from 'react-router-dom';
import { Redirect } from 'react-router'
import SignUpForm from '../../register/components/SignUpForm';
import styles from './PagesStyles.css';
import axios from 'axios';
import Footer from '../../shared/components/Footer';
class SignUpPage extends React.Component {
constructor(props) {
super(props);
this.state = {
errors: {},
client: {
userclient: '',
clientname: '',
clientbusinessname: '',
password: '',
confirmPassword: ''
}
};
this.processForm = this.processForm.bind(this);
this.changeClient = this.changeClient.bind(this);
}
changeClient(event) {
const field = event.target.name;
const client = this.state.client;
client[field] = event.target.value;
this.setState({
client
});
}
async processForm(event) {
event.preventDefault();
const userclient = this.state.client.userclient;
const clientname = this.state.client.clientname;
const clientbusinessname = this.state.client.clientbusinessname;
const password = this.state.client.password;
const confirmPassword = this.state.client.confirmPassword;
const formData = { userclient, clientname, clientbusinessname, password, confirmPassword };
axios.post('/signup', formData, { headers: {'Accept': 'application/json'} })
.then((response) => {
this.setState({
errors: {}
});
<Redirect to="/"/> // Here, nothings happens
}).catch((error) => {
const errors = error.response.data.errors ? error.response.data.errors : {};
errors.summary = error.response.data.message;
this.setState({
errors
});
});
}
render() {
return (
<div className={styles.section}>
<div className={styles.container}>
<img src={require('./images/lisa_principal_bg.png')} className={styles.fullImageBackground} />
<SignUpForm
onSubmit={this.processForm}
onChange={this.changeClient}
errors={this.state.errors}
client={this.state.client}
/>
<Footer />
</div>
</div>
);
}
}
export default SignUpPage;
क्या आप आपको पूरा घटक कोड प्रदान कर सकते हैं
—
KornholioBeavis
हां, मैं JSX का उपयोग कर रहा हूं। खैर, शायद मुझे स्पष्ट करने की आवश्यकता है। POST अनुरोध REACT घटक के अंदर है जो अनुरोध करता है।
—
moorooricio
@KornholioBeavis, निश्चित रूप से, अब आप पूरा देख सकते हैं। मैं एक्सप्रेस के साथ सर्वर बनाता हूं, मुझे नहीं पता कि आपको इस डेटा की आवश्यकता है
—
mauooricio
क्या आप मान्य कर सकते हैं कि आपको axios.post से कॉलबैक प्रतिक्रिया मिल रही है? इसके अलावा आप कहीं भी इंतजार किए बिना async फ़ंक्शन का उपयोग क्यों कर रहे हैं?
—
KornholioBeavis
Redirectलुक JSX जैसा है, JS नहीं।