ReactJS es-lint: คำสั่ง Return ไม่ควรมีการกำหนด
es-lint ล้มเหลวในกรณีนี้: Return statement ไม่ควรมีการกำหนดno-return-assign
ฉันได้ตรวจสอบชุดข้อความนี้แล้ว แต่ไม่มีประโยชน์: ฟังก์ชัน Arrow ไม่ควรส่งคืนการมอบหมายแบบไม่ส่งคืน
ฉันจะทำอย่างไรที่นี่เพื่อตอบสนองความพึงพอใจของผ้าสำลี?
ตัวแปรสถานะของฉัน
const [monthlyIncidents, setMonthlyIncidents] = useState([
// monthlyIncidents[0] -> January ... monthlyIncidents[11] -> December
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
])
ฉันกำลังอัปเดตสถานะอย่างไร
setMonthlyIncidents((prevIncidents) => {
return { ...prevIncidents, [incidentMonth]: monthlyIncidents[incidentMonth] += 1 }
})
คำตอบ
ฉันเดาว่ามันเห็น+= 1
เป็นการมอบหมาย (ซึ่งบังเอิญเป็นการกลายพันธุ์ของรัฐด้วย)
คุณอาจจะสามารถที่จะได้รับโดยมีเพียงการเพิ่มหนึ่งสถานะปัจจุบัน สิ่งนี้จะแปลงอาร์เรย์ของคุณเป็นวัตถุดังนั้นโปรดใช้ความระมัดระวัง
setMonthlyIncidents((prevIncidents) => {
return {
...prevIncidents,
[incidentMonth]: prevIncidents[incidentMonth] + 1,
}
})
โดยทั่วไปเมื่อมีการอัปเดตสถานะเช่นนี้ควรแมปสถานะที่มีอยู่กับสถานะถัดไปและอัปเดตองค์ประกอบ ดูเหมือนว่าincidentMonth
เป็นเพียงดัชนีอาร์เรย์ดังนั้นคุณสามารถจับคู่เหตุการณ์ด้วยดัชนีได้ สิ่งนี้รับประกันสถานะยังคงเป็นอาร์เรย์
setMonthlyIncidents((prevIncidents) =>
prevIncidents.map((incident, index) =>
incident + index === incidentMonth ? 1 : 0
)
);
ลอง
setMonthlyIncidents ({... prevIncidents, [IncidentMonth]: prevIncidents [อุบัติเหตุเดือน] + 1,
}).
คุณไม่จำเป็นต้องกำหนดสถานะในขณะที่ส่งคืนนอกจากนี้ฉันไม่เข้าใจจริงๆว่าทำไมคุณถึงสร้างฟังก์ชันใหม่ทั้งหมดเพื่อตั้งค่าสถานะ? ( setStateVariable
เบ็ดทำอะไร?) คุณยังสามารถปิดใช้งาน es-lint สำหรับบรรทัดนั้นได้