You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm struggling to work out the best way to fetch data from an API in Pinia within a Nuxt 3 project, in order to then be able to access that data in the store when my static site is generated.
I have seen suggestions for getters and actions, something along the lines of the below:
import { defineStore } from 'pinia';
export const todosStore = defineStore('todos', {
state: () => ({
todos: []
}),
getters: {
// BEWARE: getter names cannot be same as state props!
getTodos(state)
{
return state.todos;
}
},
actions: {
async getTestToDos()
{
fetch('https://dummyjson.com/todos')
.then((response) => response.json())
.then(({ data }) => (this.todos = data.todos))
.catch((error) => console.log(error));
}
},
});
but I'm not sure which option is correct and how to then run the fetch and access the data within a component.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I'm struggling to work out the best way to fetch data from an API in Pinia within a Nuxt 3 project, in order to then be able to access that data in the store when my static site is generated.
I have seen suggestions for getters and actions, something along the lines of the below:
but I'm not sure which option is correct and how to then run the fetch and access the data within a component.
Any help would be appreciated!
Beta Was this translation helpful? Give feedback.
All reactions