在 Vue3 中访问代理对象

Accessing a Proxy object in Vue3

如何访问在 Vue.js 中抛出代理对象的获取响应。 从字面上看,我在我的 Vue.js 组件中触发了一个方法,该方法调用了一个连接 Vuex 中的 getter 的计算函数,代码如下:

METHOD IN COMPONENT

methods: {
    ...mapActions(["getAllUsers"]),


    async gettingAllusers() {
      const target = await this.getterGetAllUsers;
      console.log(target);
      return target;
    },
  },

COMPUTED IN COMPONENT

 computed: {
    ...mapGetters(["getterGetAllUsers"]),

    getterGetAllUsersFunction() {
      return this.$store.getters.getterGetAllUsers;
    },
  },

VUEX

const store = createStore({
  state() {
    return {
      userRegisteredState: true,
      allUsersState: {},
    };
  },

  mutations: {
    
   commit_get_all_users(state, payload) {
      state.allUsersState =  payload;
      console.log(state.allUsersState);
      return state.allUsersState;
    },
  },

  getters: {
    getterGetAllUsers(state) {
      console.log(state);
      console.log(state.allUsersState)
       return state;
    },
  },

  actions: {
   
    async getAllUsers({ commit }) {
      fetch(`${urlUser}/get/all/users`, {
        method: "GET",
        headers: {
          "Content-Type": "application/json",
        },
      })
        .then((result) => {
          return result.json();
        })
        .then(async (result) => {
          await commit("commit_get_all_users",{...result});
          console.log(result);
        })
        .catch((error) => {
          console.log(error);
          error;
        });
    },
  },
});

export default store;





从字面上看,在我的组件中,触发一个计算函数,该函数由同一组件上的方法调用,使用作为源数据的操作获取并提交状态中的数据,以便 getter 以便在组件中使用 这是我的结果,但我无法访问数据目标:

任何帮助都会很棒

如果您有嵌套代理,您应该可以使用 console.log({ ...myProxy }) 访问代理内容,您也可以执行 json stringify/parse

const target = {
  message: "hello",
  nestedProxy: new Proxy({message:"nested"}, {}),
};

const proxy1 = new Proxy(target, {});

console.log(proxy1)
console.log({...proxy1})
console.log(JSON.parse(JSON.stringify(proxy1)))

我知道看起来很奇怪,但它很有魅力(甚至是嵌套代理)。

   const purchase = JSON.parse(
      JSON.stringify(store.state.cases.purchase_case)
    );