我在React中有一个Web应用
我按照React团队的建议，使用componentDidMount进行一些AJAX调用并从服务器获取一些数据
我已经注意到，当我点击该标签后，该标签被丢弃并重新加载时，状态消失，并且componentDidMount不再被调用
因此，该应用将使用默认数据呈现
还有其他人经历过吗？
答案 0 :(得分：0)
如果您共享了代码，则可以很容易地解决该问题。但是，我会对您的代码有所猜测，我认为您已将tab用作锚标签。在您的代码中使用var device_prices = new Array();
device_prices["100"]=100;
device_prices["129"]=129;
device_prices["123"]=123;
device_prices["400"]=400;
var port_prices = new Array();
port_prices["129"]=0.097;
var plan_prices = new Array();
plan_prices["35"]=35;
plan_prices["50"]=50;
plan_prices["60"]=60;
var insurance_prices = new Array();
inusrance_prices["7"]=7;
var phone_case = new Array();
phone_case["25"] = 25;
phone_case["30"] = 30;
var screen_protector = new Array();
screen_protector["15"] = 15;
function getDevicePrice() {
var deviceSelect = document.getElementById('selectDevice');
//alert(device_prices[deviceSelect.value]);
return device_prices[deviceSelect.value];
}
function getPortPrice() {
var portSelect = document.getElementById('port');
return port_prices[portSelect.value];
}
function getPlanPrice() {
var planSelected = document.getElementById('plan');
return plan_prices[planSelected.value];
}
function getInsurancePrice() {
var insurancee = document.getElementById('insurance');
return insurance_prices[insurancee.value];
}
function getCasePrice() {
var caseSelect = document.getElementById('case');
return phone_case[caseSelect.value];
}
function getScreenPrice() {
var screenSelect = document.getElementById('screen');
return screen_protector[screenSelect.value];
}
function calculateTotal() {
var total = getDevicePrice()*getPlanPrice()*getPortPrice();
total = total.toFixed(2);
var totalEl = document.getElementById('total');
document.getElementById('total').innerHTML = "Your Total is: $" + total;
totalEl.style.display = 'block';
}
function hideTotal() {
var totalEl = document.getElementById('total');
totalEl.style.display = 'none';
}
组件Link。由于react-router-dom组件默认情况下具有Link。
event.preventDefault()