Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

257
Vistas
'set' on proxy: trap returned falsish for property 'widgets'

I have problem with vue3/pinia. View.vue at the bottom:

<script setup>
import useAccount from '../stores/account.js';
import { ref } from 'vue';
import LocaleSwitch from '../components/LocaleSwitch.vue';
import { onMounted } from 'vue';
const { user, logout, widgets } = useAccount();
const showWidgets = ref(widgets);


onMounted(
  function showWidgetslog() {
   console.log('showWidgets - ', showWidgets)
  }
)
</script>

<template>
<LocaleSwitch />
<article>
  <section>
    {{ $t('account') }}: {{ user.fullName }}
  </section>
  <button class="primary" @click="logout">Logout</button>
</article>
</template>

In View.vue I am trying show in console showWidgets, but every time appears error 'set' on proxy: trap returned falsish for property 'widgets'.

This View.vue calls when I call main page in router:

routes: [{
  path: '/',
  name: 'account',
  meta: { title: 'Main' },
  component: AccountView,
  async beforeEnter(to, from, next) {
    const { fetchDesktop, id } = useAccount();
    const { fetchStaffPerson } = useStaff();
    await fetchDesktop();
    await fetchStaffPerson(id);
    return next();
  },
},

Before rendering main page (View.vue) calls store pinia:

import { defineStore } from 'pinia';
import router from '../router';
import api from '../services/api.js';

export default defineStore({
  id: 'account',
  state: () => ({
    counters: {},
    widgets: {},
  }),
  getters: {
    token: () => localStorage.getItem('token'),
    user: () => JSON.parse(localStorage.getItem('user')),
    id() { return this.user.id },
    club: () => localStorage.getItem('club'),
    widgets: (state) => state.widgets,
  },
  actions: {
    async fetchDesktop(widgetIndex) {
      try {
        let params = {
          firstCount: 0,
          secondCount: 0,
          thirdCount: 0,
          club: this.club,
        };
        if (widgetIndex == "first") {
          params.firstOffset = this.widgets[widgetIndex].items.length;
          params.firstCount = 30;
        }
        if (widgetIndex == "second") {
          params.secondOffset = this.widgets[widgetIndex].items.length;
          params.secondCount = 30;
        }
        if (widgetIndex == "third") {
          params.thirdOffset = this.widgets[widgetIndex].items.length;
          params.thirdCount = 30;
        }
        this.widgets = await api("desktop.get", params);
      } catch ({ message }) {
        console.error(message);
      }
    },
  }
});

Why this error is appear? Logically, I guess, all right. There is router hook, that calls action in pinia store (fetchDesktop), and after calculates render main page (View.vue)

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda