Using my restudy to add back to my projects

constructor(props) {
super(props);
this.state = {
this.state = {
error: null,
isLoaded: false,
// characters: [] does not do anything in my current itteration of code
};
}
componentDidMount() {
this.props.fetchCharacters();
// fetch(URL)
// .then(res => res.json())
// .then(
// (result) => {
// this.props.setAllCharacters(
// result.data
// );
// },
// (error) => {
// this.setState({
// isLoaded: true,
// error
// });
// }
// )
}
render() {
const { error } = this.state;
const { characters } = this.props;
if (error) {
return <div>Error: {error.message}</div>;
} else {
return (
class CharacterList extends Component {
<ul>
{characters.map(character => (
<LinkToCharacters character= {character} />
// <li key={character.id}>
// <Link to= {`/characters/${character.id}`}>
// {character.attributes.name}
// </Link>
// </li>
))}
</ul>
);
}
// return (
// <div>
// </div>
// )
}
}
const mapStateToProps = state => {
// console.log(state)
return {
// characters: state.allCharacters
characters: state.characters
}
}
export default connect(mapStateToProps, {fetchCharacters})(CharacterList)
// const mapDispatchToProps = dispatch => {
// return {
// setAllCharacters:(characters) => dispatch(setAllCharacters(characters))
// }
// }
// export default connect(mapStateToProps, mapDispatchToProps)(CharacterList)
export default connect(mapStateToProps, {fetchCharacters})(CharacterList)
headers: {
"Content-Type": "application/json",
Accept: "application/json"
},
},
body: JSON.stringify(character)
};
console.log("c")
fetch("http://localhost:3001/characters", configObj)
// number of p rq
.then((res) => res.json())
.then((newCharacter) => {
console.log("d")
dispatch(addCharacter(newCharacter))});
}
}
const addCharacter = (character) => ({type: "ADDED_CHARACTER", payload: character})
// const initialState = {
// allCharacters: [],
// }
// export default (state = initialState, action) => {
// switch(action.type) {
// case "SET_ALL_CHARACTERS":
// return {
// ...state,
// // allCharacters: action.allCharacters
// allCharacters: action.payload
// }
// default:
// return state
// }
// }
// export const setAllCharacters = allCharacters => {
// return {
// type: "SET_ALL_CHARACTERS",
// allCharacters
// }
// }

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How to Add header to every request that is using http-client

Why Dark Mode Is Hard

Adding JavaScript to the Mix

How to build an Angular Application with ASP.NET Core in Visual Studio 2017, visualized

Essential things to make WebScraping easy(Selenium/java)

The essential interview questions and terms for JavaScript developers — part 1

Making a Multilingual Site With Next.JS — Part 2

Angular’s Backyard: The Resolving of Components Dependencies

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Parker Williamson

Parker Williamson

More from Medium

Creativity, Rest, Intimacy and Play: Artists Statement on Killing Time and Making Crip Art

KT Simi: The Introduction It is said that there’s more to someone than meets the eye; well, I can…

Looking at the Cherry Blossoms of 2021

‘A ghost is driving the car’ — my peaceful and productive experience in a Waymo self-driving van