在 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)
);
如何访问在 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)
);