Solution: Constant Types

Solution

Your task was to use constant types for the todos module and to access its values and methods in the App.vue file. Here are the required changes:

For the src/store/modules/todos/todosTypes.js file:

• Add GET_TODOS, FETCH_TODOS, and SET_TODOS types.

For the src/store/modules/todos/todos.js file:

• Import types created in the todosTypes.
• Replace getTodos getters with [todosTypes.GET_TODOS].
• Replace the fetchTodos action with [todosTypes.FETCH_TODOS].
• Replace the SET_TODOS mutation with [todosTypes.SET_TODOS].

For the src/App.vue file:

• Import GET_TODOS and FETCH_TODOS from the todosTypes.js file.
• Update mapping helpers to use the imported constant types.

Let’s run the widget below to understand how the solution above works.

Note: The code below may take a while to run. When the server starts, go to the app URL, and see the output.