Solution: Constant Types

Here’s the solution for how to use constant types in the project.

We'll cover the following


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:


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.

Get hands-on with 1200+ tech skills courses.