Uso this.$axios muchas veces, así que traté de ponerlo en una constante, pero no funciona. Leí los documentos oficiales pero no entendí. ¿Es porque this no está disponible en el ciclo de vida de Nuxt.js?
url.js
export const AXIOS_POST = this.$axios.$post export const POST_API = '/api/v1/' export const POST_ITEMS_API = '/api/v1/post_items/'Vuex
import * as api from './constants/url.js' // url.js in this. export const state = () => ({ list: [], hidden: false }) export const mutations = { add (state, response) { state.list.push({ content: response.content, status: response.status }) }, remove (state, todo) { state.list.splice(state.list.indexOf(todo), 1) }, edit (state, { todo, text }) { state.list.splice(state.list.indexOf(todo), 1, { text }) }, toggle (state, todo) { todo.status = !todo.status }, cancel (state, todo) { todo.status = false }, // アクション登録パネルフラグswitching (state) { state.hidden = !state.hidden } } export const actions = { post ({ commit }, text) { //I want to use it here this.$axios.$post(api.POST_ITEMS_API + 'posts', { post_items: { content: text, status: false } }) .then((response) => { commit('add', response) }) } }TypeError no capturado: no se puede leer la propiedad '$ axios' de undefined
Dado que su archivo está ubicado en un directorio de constants , probablemente debería usar algún archivo .env .
Aquí hay una guía sobre cómo lograr esto en Nuxt: https://stackoverflow.com/a/67705541/8816585
Si realmente desea tener acceso a él en un archivo que no .vue , puede importarlo como de costumbre con algo como esto
/constants/url.js
import store from '~/store/index' export const test = () => { // the line below depends of your store of course return store.modules['@me'].state.email } PD: getters , dispatch y todo lo demás está disponible aquí.
Luego llámelo en una página o componente .vue como este
<script> import { test } from '~/constants/url' export default { mounted() { console.log('call the store here', test()) }, } </script> En cuanto a la pregunta del ciclo de vida, dado que el archivo url.js no está en un archivo .vue sino en un JS normal, no tiene idea de ningún ciclo de vida de Vue/Nuxt .