如何使用按钮 onClick
事件从 map
函数内部更改数组的值。在下面的示例中,我定义了具有三个对象的数组名称 visitMyArray
,并且最初 visited
键的值设置为 false
。使用 map
函数,我渲染 paragraph
标记内的所有 location
。每个段落
都会呈现一个按钮
。是否可以将 visited
的值从 false
更改为 true
如果可能的话,我该怎么做。
import React from "react";
import {Button} from 'react-bootstrap';
class VisitComponent extends React.Component {
render(){
let visitmyArray = [
{
location:"Indiana",
visited:false
},
{
location:"Illinoi",
visited:false
},
{
location:"Ohio",
visited:false
}
]
return(
<div>
{visitmyArray.map((visitedArray, index) => {
<div key={index}>
<p>{visitedArray.location}</p>
<Button onClick={"Change the visited value from 'false' to 'true' for this object value"}>Continue</Button>
</div>
)})}
</div>
}
}
export default VisitComponent
最佳答案
您可以将 map 上每个项目的 visited
属性设置为 true
。您的 onClick
现在将是
onClick={() => {visitedArray.visited = true}}
关于javascript - 在单击事件时更改数组中对象的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59269676/