Creating the Posts Slice
Now we will create the posts slice to be able to create, store and display posts. Create a new file called postsSlice.js in the features folder. We will use the createSlice function to create the slice, as we did in the previous chapter.
The slice will have a posts array which will initially be empty, lastID state which will have a value of 0 initially, and a createPost action which will be used for appending posts (in the form of JS objects) to the array in the store.
We also need to export the action, a selector, and reducer.
export const { createPost } = postsSlice.actions;
export const selectPosts = (state) => state.post.posts;
export default postsSlice.reducer;
Now that the export is done, we will import it in the store.js to create the slice. The store.js should look something like this:
import { configureStore } from '@reduxjs/toolkit';
import profileReducer from '../features/profileSlice';
import postsReducer from '../features/postsSlice';
export const store = configureStore({
reducer: {
profile: profileReducer,
post: postsReducer
},
});
In the next chapter, we will try to make the posting feature functional.
¡Gracias por tus comentarios!
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Genial!
Completion tasa mejorada a 3.45
Creating the Posts Slice
Desliza para mostrar el menú
Now we will create the posts slice to be able to create, store and display posts. Create a new file called postsSlice.js in the features folder. We will use the createSlice function to create the slice, as we did in the previous chapter.
The slice will have a posts array which will initially be empty, lastID state which will have a value of 0 initially, and a createPost action which will be used for appending posts (in the form of JS objects) to the array in the store.
We also need to export the action, a selector, and reducer.
export const { createPost } = postsSlice.actions;
export const selectPosts = (state) => state.post.posts;
export default postsSlice.reducer;
Now that the export is done, we will import it in the store.js to create the slice. The store.js should look something like this:
import { configureStore } from '@reduxjs/toolkit';
import profileReducer from '../features/profileSlice';
import postsReducer from '../features/postsSlice';
export const store = configureStore({
reducer: {
profile: profileReducer,
post: postsReducer
},
});
In the next chapter, we will try to make the posting feature functional.
¡Gracias por tus comentarios!