Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

254
Views
'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
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!