我已经为此苦苦挣扎了几天,也许你能帮帮我。我正在尝试从 firebase 获取数据(保存在 state.state.memory
中并将其显示在我的模板上。我的变量 saved 在控制台上更新,但模板没有显示任何内容。我尝试了所有方法,但我无法在模板上获得任何内容,你能解释一下吗?
谢谢!!
<template>
<div class="memory" id="memory">
Memory
<div class="elementos-memoria" v-for="item in saved" :key="item">
{{ item.primero + item.operador + item.segundo + ' = ' + item.resultado }}
</div>
<div class="elementos-memoria" v-for="cuenta in cuentas" :key="cuenta">
{{ cuenta }}
</div>
</div>
</template>
import M from "materialize-css";
import { inject, reactive, watch } from "vue";
export default {
props: {
cuentas: Array,
},
setup() {
const state = inject("store");
let saved = reactive({});
watch(
() => state.state.memory,
() => {
saved = state.state.memory;
console.log(saved);
}
);
setInterval(() => console.log(saved), 1000);
return {
saved,
};
},
mounted() {
M.AutoInit();
},
};
const state = reactive({
user: {},
memory: {},
})
const login = (email, password) => {
let memory = []
auth.signInWithEmailAndPassword(email, password).then((data) => {
state.user = data.user
db.collection('users').doc(state.user.uid).collection('operaciones').get().then((queryResult) => {
queryResult.forEach(doc => {
memory.push(doc.data())
})
state.memory = memory
}).catch(err => console.log(err))
})
}
const signIn = (email, password) => {
auth.createUserWithEmailAndPassword(email, password).then(cred => {
state.user = cred.user;
})
}
const logout = () => {
auth.signOut().then(() => {
state.user = null;
state.memory = null;
})
}
最佳答案
看起来你正在替换响应式 state
值而不是改变它
saved = state.state.memory;
将替换它。
不确定 state.state.memory
对象中有什么(假设它是一个对象),但您可以使用 Object.assign
动态更新:
if (state.state.memory) {
Object.assign(saved, state.state.memory)
}
关于vuejs3 - react 对象未在模板 Vue3 Composition API 上更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67971134/