如何解决操作完成后触发函数ReactJS
我正在学习ReactJS,并开始使用AltJS。我现在无法控制操作流程。
我的 ComponentDidMount()
中有以下App.js
(它会转到数据库并检查版本号。如果它与用户在其本地存储中的版本号不同,那么我将从db并将它们存储在它们的localstorage中,并保存相同的版本号。如果它是相同的版本,那么我将保留其localstorage以防止在db中进行无用的读取):
checkProductsVersion() {
return (dispatch) => {
const productsCounterRef = firebase
.database()
.ref()
.child('utils')
.child('versions')
.child('products');
productsCounterRef.on('value',(snapshot) => {
const currentProductsVersion = snapshot.val();
const localProductsVersion = localStorage.getItem('localProductsVersion');
if (
currentProductsVersion &&
localProductsVersion &&
currentProductsVersion == localProductsVersion
) {
let products = localStorage.getItem('products');
if (products) {
dispatch(products);
}
} else {
console.log('Wrong checkProductsVersion');
firebase
.database()
.ref('products')
.orderByChild('releaseDate')
.on('value',function (snapshot) {
const products = [];
snapshot.forEach(function (data) {
const product = data.val();
product['key'] = data.key;
products.push(product);
});
localStorage.setItem('products',JSON.stringify(products));
localStorage.setItem('localProductsVersion',currentProductsVersion);
dispatch(products);
});
}
});
};
}
然后在我的组件中,我使用以下内容:
componentDidMount() {
Actions.initSession();
Actions.checkProductsVersion();
// Get Products from localstorage
let products = localStorage.getItem('products');
if (products) {
Actions.dispatchProducts(products);
}
const parsedProducts = JSON.parse(localStorage.getItem('products'));
// Create productMap
const productMap = new Map();
parsedProducts.forEach(function (data) {
const products = [];
const product = data;
product['key'] = data.key;
products.push(product);
const date = new Date(product.releaseDate);
const key = `${date.getFullYear()}${('0' + (date.getMonth() + 1)).slice(-2)}${(
'0' + date.getDate()
).slice(-2)}`;
const existingProducts = productMap.get(key) || [];
productMap.set(key,[...existingProducts,product]);
});
Actions.dispatchProductMap(productMap);
(2 other actions after ...)
}
我的问题是const parsedProducts = JSON.parse(localStorage.getItem('products'));
会在Actions.checkProductsVersion();
完成之前触发,因此如果本地存储为空,则会引发错误。.我已经花了整整一天的时间来尝试执行此操作没有成功
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。