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.
Kiitos palautteestasi!
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Awesome!
Completion rate improved to 3.45
Creating the Posts Slice
Pyyhkäise näyttääksesi valikon
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.
Kiitos palautteestasi!