gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix:Incorrect Usage of setState in React Challenge (#39290)

Browse Source 
* fix:Incorrect Usaage of setState in React Challenge

* apply suggestion

* also set stage usage in other challenges

* fix setState usage in challenges

* correct syntax

* correct usage of useState in other files

* add current message to state

* remove current message from state

* change connect redux to the message app

* remove extra space
This commit is contained in:
Ruchi Kushwaha
2020-08-11 22:42:27 +05:30
committed by GitHub
parent 817325d68e
commit 35c3609489
8 changed files with 55 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
curriculum/challenges/english/03-front-end-libraries/react-and-redux/connect-redux-to-the-messages-app.english.md
View File

@ -85,10 +85,12 @@ class Presentational extends React.Component {
});
}
submitMessage() {
const currentMessage = this.state.input;
this.setState({
input: '',
messages: this.state.messages.concat(currentMessage)
this.setState((state) => {
const currentMessage = state.input;
return {
input: '',
messages: state.messages.concat(currentMessage)
};
});
}
render() {
@ -202,10 +204,12 @@ class Presentational extends React.Component {
});
}
submitMessage() {
const currentMessage = this.state.input;
this.setState({
input: '',
messages: this.state.messages.concat(currentMessage)
this.setState((state) => {
const currentMessage = state.input;
return {
input: '',
messages: state.messages.concat(currentMessage)
};
});
}
render() {

6
curriculum/challenges/english/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.english.md
View File

@ -97,10 +97,10 @@ class Presentational extends React.Component {
});
}
submitMessage() {
this.setState({
this.setState((state) => ({
input: '',
messages: this.state.messages.concat(this.state.input)
});
messages: state.messages.concat(state.input)
}));
}
render() {
return (

10
curriculum/challenges/english/03-front-end-libraries/react-and-redux/manage-state-locally-first.english.md
View File

@ -107,10 +107,12 @@ class DisplayMessages extends React.Component {
});
}
submitMessage() {
const currentMessage = this.state.input;
this.setState({
input: '',
messages: this.state.messages.concat(currentMessage)
this.setState((state) => {
const currentMessage = state.input;
return {
input: '',
messages: state.messages.concat(currentMessage)
};
});
}
render() {

20
curriculum/challenges/english/03-front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react.english.md
View File

@ -94,10 +94,12 @@ class DisplayMessages extends React.Component {
});
}
submitMessage() {
const currentMessage = this.state.input;
this.setState({
input: '',
messages: this.state.messages.concat(currentMessage)
this.setState((state) => {
const currentMessage = state.input;
return {
input: '',
messages: state.messages.concat(currentMessage)
};
});
}
render() {
@ -191,10 +193,12 @@ class DisplayMessages extends React.Component {
});
}
submitMessage() {
const currentMessage = this.state.input;
this.setState({
input: '',
messages: this.state.messages.concat(currentMessage)
this.setState((state) => {
const currentMessage = state.input;
return {
input: '',
messages: state.messages.concat(currentMessage)
};
});
}
render() {

12
curriculum/challenges/english/03-front-end-libraries/react/add-event-listeners.english.md
View File

@ -61,9 +61,9 @@ class MyComponent extends React.Component {
}
// change code above this line
handleEnter() {
this.setState({
message: this.state.message + 'You pressed the enter key! '
});
this.setState((state) => ({
message: state.message + 'You pressed the enter key! '
}));
}
handleKeyPress(event) {
if (event.keyCode === 13) {
@ -118,9 +118,9 @@ class MyComponent extends React.Component {
// change code above this line
}
handleEnter() {
this.setState({
message: this.state.message + 'You pressed the enter key! '
});
this.setState((state) => ({
message: state.message + 'You pressed the enter key! '
}));
}
handleKeyPress(event) {
if (event.keyCode === 13) {

6
curriculum/challenges/english/03-front-end-libraries/react/create-a-controlled-form.english.md
View File

@ -120,9 +120,9 @@ class MyForm extends React.Component {
}
handleSubmit(event) {
event.preventDefault()
this.setState({
submit: this.state.input
});
this.setState((state) => ({
submit: state.input
}));
}
render() {
return (

12
curriculum/challenges/english/03-front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate.english.md
View File

@ -69,9 +69,9 @@ class Controller extends React.Component {
this.addValue = this.addValue.bind(this);
}
addValue() {
this.setState({
value: this.state.value + 1
});
this.setState((state) => ({
value: state.value + 1
}));
}
render() {
return (
@ -130,9 +130,9 @@ class Controller extends React.Component {
this.addValue = this.addValue.bind(this);
}
addValue() {
this.setState({
value: this.state.value + 1
});
this.setState((state) => ({
value: state.value + 1
}));
}
render() {
return (

12
curriculum/challenges/english/03-front-end-libraries/react/render-with-an-if-else-condition.english.md
View File

@ -51,9 +51,9 @@ class MyComponent extends React.Component {
this.toggleDisplay = this.toggleDisplay.bind(this);
}
toggleDisplay() {
this.setState({
display: !this.state.display
});
this.setState((state) => ({
display: !state.display
}));
}
render() {
// change code below this line
@ -96,9 +96,9 @@ class MyComponent extends React.Component {
this.toggleDisplay = this.toggleDisplay.bind(this);
}
toggleDisplay() {
this.setState({
display: !this.state.display
});
this.setState((state) => ({
display: !state.display
}));
}
render() {
// change code below this line