如何对对象使用条件语句
[英]How to use conditional statements on objects
问题描述
I am trying to create the logic behind displaying some data fetched from an API, as well as changing the background color of a bar, but so far I haven been able to get it to work, can anyone help?
我正在尝试创建显示从 API 获取的一些数据背后的逻辑，以及更改条形的背景颜色，但到目前为止我已经能够让它工作，有人可以帮忙吗？
html: html：
<section class="pegs-container">
<div class="peg-container-left">
<div class="peg-wrapper">
<div class="peg-name-1">
<h4>1</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-1">-</span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-1">
</span>
<div class="peg-1-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-1">-</span>
<span id="peg-1-update-time">-</span>
</div>
<div class="peg-1-bar">
<div class="peg-1-bar-fill">
</div>
</div>
<div class="peg-1-timer">
<span id="time-peg-1">-</span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-3">
<h4>3</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-3"></span>
<p class="label-1">Ends: </a>
</p>
<span id="time-end-peg-3">-</span>
<div class="peg-3-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-3"></span>
<span id="peg-3-update-time">+10</span>
</div>
<div class="peg-3-bar">
<div class="peg-3-bar-fill">
</div>
</div>
<div class="peg-3-timer">
<span id="time-peg-3"></span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-5">
<h4>5</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-5"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-5"></span>
<div class="peg-5-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-5"></span>
<span id="peg-5-update-time">+10</span>
</div>
<div class="peg-5-bar">
<div class="peg-5-bar-fill">
</div>
</div>
<div class="peg-5-timer">
<span id="time-peg-5">
<p></p>
</span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-7">
<h4>7</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-7"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-7"></span>
<div class="peg-7-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-7"></span>
<span id="peg-7-update-time">+10</span>
</div>
<div class="peg-7-bar">
<div class="peg-7-bar-fill">
</div>
</div>
<div class="peg-7-timer">
<span id="time-peg-7"></span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-9">
<h4>9</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-9"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-9"></span>
<div class="peg-9-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-9"></span>
<span id="peg-9-update-time">+10</span>
</div>
<div class="peg-9-bar">
<div class="peg-9-bar-fill">
</div>
</div>
<div class="peg-9-timer">
<span id="time-peg-9">
<p></p>
</span>
</div>
</div>
<div class="header-2">
<h1>PRIVATE AREA</h1>
</div>
<div class="peg-wrapper">
<div class="peg-name-10">
<h4>10</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-10">10</span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-10">
</span>
<div class="peg-10-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-10">
<span id="peg-10-update-time">+10</span>
</span>
</div>
<div class="peg-10-bar">
<div class="peg-10-bar-fill">
</div>
</div>
<div class="peg-10-timer">
<span id="time-peg-10">
</span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-12">
<h4>12</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-12"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-12">-</span>
<div class="peg-12-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-12">
<span id="peg-12-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-12-bar">
<div class="peg-12-bar-fill">
</div>
</div>
<div class="peg-12-timer">
<span id="time-peg-12">
<p></p>
</span>
</div>
</div>
</div>
<div class="peg-container-right">
<div class="peg-wrapper">
<div class="peg-name-2">
<h4>2</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-2"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-2">
</span>
<div class="peg-2-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-2">
<span id="peg-2-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-2-bar">
<div class="peg-2-bar-fill ">
</div>
</div>
<div class="peg-2-timer">
<span id="time-peg-2">
<p></p>
</span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-4">
<h4>4</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-4"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-4">-</span>
<div class="peg-4-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-4">
<span id="peg-4-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-4-bar">
<div class="peg-4-bar-fill">
</div>
</div>
<div class="peg-4-timer">
<span id="time-peg-4">
<p></p>
</span>
</div>
</div>
<div class="peg-wrapper">
<div class="peg-name-6">
<h4>6</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-6"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-6"></span>
<div class="peg-6-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-6">
<span id="peg-6-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-6-bar">
<div class="peg-6-bar-fill">
</div>
</div>
<div class="peg-6-timer">
<span id="time-peg-6">
<p></p>
</span>
</div>
</div>
<div class="peg-wrapper-8">
<div class="peg-name-8">
<h4>8</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-8"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-8">-</span>
<div class="peg-8-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-8">
<span id="peg-8-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-8-bar">
<div class="peg-8-bar-fill">
</div>
</div>
<div class="peg-8-timer">
<span id="time-peg-8">
<p></p>
</span>
</div>
</div>
<div class="peg-wrapper-11">
<div class="peg-name-11">
<h4>11</h4>
</div>
<p class="label-3">Starts:</p>
<span class="time-start-peg-11"></span>
<p class="label-1">Ends:</p>
<span id="time-end-peg-11">
</span>
<div class="peg-11-start-time total-time">
<p class="label-2">Length:</p>
<span id="total-time-11">
<span id="peg-11-update-time">+10</span>
<p></p>
</span>
</div>
<div class="peg-11-bar">
<div class="peg-11-bar-fill">
</div>
</div>
<div class="peg-11-timer">
<span id="time-peg-11">
<p></p>
</span>
</div>
</div>
</div>
css: css：
.pegs-container {
border-radius: 25px;
display: grid;
grid-template-columns: 600px 600px;
grid-column-gap: 40px;
justify-content: center;
align-items: center;
margin: auto;
max-width: 1000px;
}
.peg-container-left, .peg-container-right {
color: var(--dark-green-color);
width: 600px;
}
.peg-wrapper {
background-color: var(--color-white);
border-radius: 15px;
box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
margin-bottom: 26px;
margin-left: 80px;
height: 97px;
}
.peg-wrapper-8 {
background-color: var(--color-white);
border-radius: 15px;
margin-bottom: 180px;
margin-left: 80px;
box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
height: 97px;
}
.peg-wrapper-11 {
background-color: var(--color-white);
border-radius: 15px;
margin-bottom: 130px;
margin-left: 80px;
box-shadow: 2px 1px 1px 1px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
height: 97px;
}
.peg-name-1, .peg-name-2, .peg-name-3, .peg-name-4, .peg-name-5, .peg-name-6, .peg-name-7, .peg-name-8, .peg-name-9, .peg-name-10, .peg-name-11, .peg-name-12 {
display: inline-block;
background-color: var(--color-white);
border-radius: 50%;
height: 25px;
width: 30px;
font-family: var(--font-paraghraph);
text-align: center;
padding-top: 5px;
border: 2px solid var(--peg-label-dark-green);
z-index: 1;
transform: translate(-0.8rem, -3ex);
/*do not change*/
}
.label-1 {
color: gray;
font-family: var(--font-paraghraph);
font-size: 16px;
margin-left: 60px;//it was -1
margin-right: 10px;
max-width: 125px;
display: inline-flex;
}
.label-2 {
color: gray;
font-family: var(--font-paraghraph);
font-size: 16px;
margin-left: 80px;
margin-right: 10px;
}
.label-3 {
color: gray;
font-family: var(--font-paraghraph);
font-size: 16px;
margin-left: 0px;
margin-right: 10px;
display: inline-flex;
}
/* empty container only to show if time is added to the session */
#peg-1-update-time,#peg-2-update-time, #peg-3-update-time,#peg-4-update-time,#peg-5-update-time,#peg-6-update-time,#peg-7-update-time,#peg-8-update-time,#peg-9-update-time,#peg-10-update-time,#peg-11-update-time,#peg-12-update-time{
visibility: hidden;
}
/* Progress-bars */
.peg-1-bar, .peg-2-bar, .peg-3-bar, .peg-4-bar, .peg-5-bar, .peg-6-bar, .peg-7-bar, .peg-8-bar, .peg-9-bar, .peg-10-bar, .peg-11-bar, .peg-12-bar {
background-color: var(--color-light-gray);
border-radius: 50px;
height: 20px;
width: 400px;
margin-left: 30px;
}
.peg-1-bar-fill, .peg-2-bar-fill, .peg-3-bar-fill, .peg-4-bar-fill, .peg-5-bar-fill, .peg-6-bar-fill, .peg-7-bar-fill, .peg-8-bar-fill, .peg-9-bar-fill, .peg-10-bar-fill,
.peg-11-bar-fill, .peg-12-bar-fill {
border-radius: 50px;
height: 100%;
width: 100%;
max-width: 400px;
}
.peg-1-timer, .peg-1-start-time, .peg-2-timer, .peg-2-start-time, .peg-3-timer, .peg-3-start-time, .peg-4-timer, .peg-4-start-time, .peg-5-timer, .peg-5-start-time, .peg-6-timer, .peg-6-start-time, .peg-7-timer, .peg-7-start-time, .peg-8-timer, .peg-8-start-time, .peg-9-timer, .peg-9-start-time, .peg-10-timer, .peg-10-start-time, .peg-11-timer, .peg-11-start-time, .peg-12-timer, .peg-12-start-time {
text-align: center;
max-width: 100px;
display: inline-flex;
margin-left: -10px;
}
.peg-1-timer,.peg-2-timer,.peg-3-timer,.peg-4-timer,.peg-5-timer,.peg-6-timer,.peg-7-timer,.peg-8-timer,.peg-9-timer,.peg-10-timer, .peg-11-timer,.peg-12-timer{
transform: translate(1rem, -4ex);
margin-left: 425px;
}
.total-time, .time-left {
margin-top: 12px;
padding-bottom: 12px;
text-align: center;
}
this is the js:这是js：
const peg1 = {
status: completedata[0].id,
startTime: completedata[1].price,
endTime: completedata[0].price,
totalLength: completedata[0].price + 'm',
remainingTime: completedata[0].price + 'm',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-1").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-1").innerHTML = peg1.startTime;
document.getElementById("total-time-1").innerHTML = peg1.totalLength;
document.getElementById("time-peg-1").innerHTML = peg1.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg1.totalLength;
const peg2 = {
status: completedata[1].id,
startTime: completedata[2].price,
endTime: completedata[2].price,
totalLength: completedata[2].price +'m',
remainingTime: completedata[2].price +'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-2").innerHTML = peg2.startTime;
document.getElementById("time-end-peg-2").innerHTML = peg2.startTime;
document.getElementById("total-time-2").innerHTML = peg2.totalLength;
document.getElementById("time-peg-2").innerHTML = peg2.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg1.totalLength;
const peg3 = {
status: completedata[0].id,
startTime: completedata[3].price,
endTime: completedata[3].price,
totalLength: completedata[3].price +'m',
remainingTime: completedata[3].price +'m',
barPercentage:completedata[8].price,
};
document.getElementsByClassName("time-start-peg-3").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-3").innerHTML = peg1.startTime;
document.getElementById("total-time-3").innerHTML = peg1.totalLength;
document.getElementById("time-peg-3").innerHTML = peg1.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg1.totalLength;
const peg4 = {
status: completedata[2].id,
startTime: completedata[4].price,
endTime: completedata[4].price,
totalLength: completedata[4].price +'m',
remainingTime: completedata[4].price +'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-4").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-4").innerHTML = peg1.startTime;
document.getElementById("total-time-4").innerHTML = peg1.totalLength;
document.getElementById("time-peg-4").innerHTML = peg1.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg1.totalLength;
const peg5 = {
status: completedata[2].id,
startTime: completedata[5].price +'m',
endTime: completedata[5].price +'m',
totalLength: completedata[5].price +'m',
remainingTime: completedata[5].price +'m',
barPercentage:completedata[8].price,
};
document.getElementsByClassName("time-start-peg-5").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-5").innerHTML = peg1.startTime;
document.getElementById("total-time-5").innerHTML = peg1.totalLength;
document.getElementById("time-peg-5").innerHTML = peg1.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg1.totalLength;
const peg6 = {
status: completedata[1].id,
startTime: completedata[6].price,
endTime: completedata[6].price,
totalLength: completedata[6].price+'m',
remainingTime: completedata[6].price+'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-6").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-6").innerHTML = peg1.startTime;
document.getElementById("total-time-6").innerHTML = peg1.totalLength;
document.getElementById("time-peg-6").innerHTML = peg1.totalLength;
// document.getElementById("peg-6-update-time").innerHTML = peg1.totalLength;
const uiProgressBarPeg7 = document.getElementById(`peg-7-bar-fill`);
const peg7 = {
status: completedata[1].id,
startTime: completedata[7].price,
endTime: completedata[7].price,
totalLength: completedata[7].price+'m',
remainingTime: completedata[7].price+'m',
barPercentage:completedata[8].price,
};
document.getElementsByClassName("time-start-peg-7").innerHTML = peg2.startTime;
document.getElementById("time-end-peg-7").innerHTML = peg2.startTime;
document.getElementById("total-time-7").innerHTML = peg2.totalLength;
document.getElementById("time-peg-7").innerHTML = peg2.totalLength;
// document.getElementById("peg-7-update-time").innerHTML = peg2.totalLength;
const peg8 = {
status: completedata[0].id,
startTime: completedata[7].price,
endTime: completedata[7].price,
totalLength: completedata[7].price +'m',
remainingTime: completedata[7].price +'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-8").innerHTML = peg8.startTime;
document.getElementById("time-end-peg-8").innerHTML = peg8.startTime;
document.getElementById("total-time-8").innerHTML = peg8.totalLength;
document.getElementById("time-peg-8").innerHTML = peg8.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg8.totalLength;
const peg9 = {
status: completedata[1].id,
startTime: completedata[8].price,
endTime: completedata[8].price,
totalLength: completedata[8].price+'m',
remainingTime: completedata[8].price+'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-9").innerHTML = peg9.startTime;
document.getElementById("time-end-peg-9").innerHTML = peg9.startTime;
document.getElementById("total-time-9").innerHTML = peg9.totalLength;
document.getElementById("time-peg-9").innerHTML = peg9.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg9.totalLength;
const peg10 = {
status: completedata[1].id,
startTime: completedata[9].price,
endTime: completedata[9].price,
totalLength: completedata[9].price+'m',
remainingTime: completedata[9].price+'m',
barPercentage:completedata[8].price,
};
document.getElementsByClassName("time-start-peg-10").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-10").innerHTML = peg10.startTime;
document.getElementById("total-time-10").innerHTML = peg10.totalLength;
document.getElementById("time-peg-10").innerHTML = peg10.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg10.totalLength;
const peg11 = {
status: completedata[0].id,
startTime: completedata[10].price,
endTime: completedata[10].price,
totalLength: completedata[10].price+'m',
remainingTime: completedata[10].price+'m',
barPercentage: completedata[8].price,
};
document.getElementsByClassName("time-start-peg-11").innerHTML = peg1.startTime;
document.getElementById("time-end-peg-11").innerHTML = peg11.startTime;
document.getElementById("total-time-11").innerHTML = peg11.totalLength;
document.getElementById("time-peg-11").innerHTML = peg11.totalLength;
// document.getElementById("peg-11-update-time").innerHTML = peg11.totalLength;
const peg12 = {
status: completedata[1].id,
startTime: completedata[11].price,
endTime: completedata[11].price,
totalLength: completedata[11].price+'m',
remainingTime: completedata[11].price+'m',
barPercentage:completedata[8].price ,
};
document.getElementsByClassName("time-start-peg-12").innerHTML = peg12.startTime;
document.getElementById("time-end-peg-12").innerHTML = peg12.startTime;
document.getElementById("total-time-12").innerHTML = peg12.totalLength;
document.getElementById("time-peg-12").innerHTML = peg12.totalLength;
// document.getElementById("peg-1-update-time").innerHTML = peg12.totalLength;
the idea would be to implement the following code:这个想法是实现以下代码：
if( peg7.status === 0){
uiProgressBarPeg7.style.background = "var(--color-light-gray)";
} else if ( peg7.status === 1) {
uiProgressBarPeg7.style.background = "var(--dark-green-color)";
} else if ( peg7.status === 2) {
uiProgressBarPeg7.style.background = "var(--light-orange-color)";
} else if(peg7.status === 3){
uiProgressBarPeg7.style.background = "var(--light-red-color)";
uiTime.style.fontFamily = 'Poppins, sans-serif';
uiTime.style.fontSize = '16px';
}
else if (peg7.status === 4){
uiProgressBarPeg7.style.background = "var(--color-light-gray)";
}
if( peg7.status== 0 & peg7.barPercentage ===0 ){
uiProgressBarPeg7.style.background = "var(--color-light-gray)";
}
For every peg object, I thought about putting everything on an array but I have no idea how to wrap everything.对于每个挂钩 object，我考虑将所有内容放在一个数组中，但我不知道如何包装所有内容。
Any help is welcome.欢迎任何帮助。
1 个解决方案
解决方案1
2 已采纳 2022-09-05 18:56:50
Leaving your HTML and CSS as is, I will refactor the JavaScript to be like this.保留您的 HTML 和 CSS 原样，我将把 JavaScript 重构为这样。
// This map is going to be used to look up the background color for different status,
// it should eliminate the need to do multiple if conditions
const pegBackgrounds = new Map();
pegBackgrounds.set(0, "var(--color-light-gray)");
pegBackgrounds.set(1, "var(--dark-green-color)");
pegBackgrounds.set(2, "var(--light-orange-color)");
pegBackgrounds.set(3, "var(--light-red-color)");
pegBackgrounds.set(4, "var(--color-light-gray)");
// Assuming this is coming from some api
const completeData = [
{ id: 1, price: 1 },
{ id: 2, price: 2 },
{ id: 3, price: 3 },
{ id: 4, price: 4 },
{ id: 5, price: 5 },
{ id: 6, price: 6 },
{ id: 7, price: 7 },
{ id: 8, price: 8 },
{ id: 9, price: 9 },
{ id: 10, price: 10 },
{ id: 11, price: 11 },
{ id: 12, price: 12 },
];
// Transform your response from api into the shape of your choice
const pegs = completeData.map((peg) => {
return {
status: peg.id,
startTime: peg.price,
endTime: peg.price,
totalLength: peg.price + "m",
remainingTime: peg.price + "m",
barPercentage: peg.price,
};
});
// Run through each of your peg items and set the style based on the element index, although this could be improved,
// I have done whatever I could assume based on whatever code you've provided
pegs.forEach((peg, index) => {
const startTimeNode = document.getElementsByClassName(
`time-start-peg-${index + 1}`
);
const startTimeText = document.createTextNode(peg.startTime);
startTimeNode.append(startTimeText);
const endTimeNode = document.getElementsByClassName(
`time-end-peg-${index + 1}`
);
const endTimeText = document.createTextNode(peg.startTime);
endTimeNode.append(endTimeText);
const totalTimeNode = document.getElementsByClassName(
`total-time-${index + 1}`
);
const totalTimeText = document.createTextNode(peg.totalLength);
totalLengthNode.append(totalTimeText);
const timeNode = document.getElementsByClassName(`time-peg-${index + 1}`);
const timeText = document.createTextNode(peg.totalLength);
timeNode.append(timeText);
});
// Lastly, I don't know where this uiProgressBarPeg7 comes from, but you can set style for it by looking
// up the value inside pegBackgrounds map that we created, which removes the need to do multiple if statements
uiProgressBarPeg7.style.background = pegBackgrounds.get(peg7.status);
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
如何在条件语句中使用 javascript new Date() 对象？ - How do I use javascript new Date() objects in conditional statements?
如何处理JavaScript条件语句中的可为空的对象 - How do I deal with nullable objects in JavaScript conditional statements
如何在if语句中使用对象-Javascript - How to use objects within if statements - Javascript
在Jasmine测试中使用条件语句 - Use of conditional statements in Jasmine tests
我怎样才能使用条件语句来切换我标题的颜色？ - how can i use conditional statements to switch colors of my heading?
如何缩短我的条件陈述 - How to shorten my conditional statements
如何使条件语句中的条件语句起作用？ - How do I make conditional statements within conditional statements work?
使用两个命名函数，还是使用一个带条件语句？ - Use Two Named Functions, or One With Conditional Statements?
使用 for 循环进行数组迭代 - 使用条件语句和返回 - Array iteration with for loop - use of conditional statements and returns
如何使用状态变量有条件地声明对象数组？ - How to use state variable for conditional declaring of array of objects?
相关标签