Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/google-sheets/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 添加+;1到数组中单击的元素_Javascript_Arrays_Reactjs_React Hooks - Fatal编程技术网

Javascript 添加+;1到数组中单击的元素

Javascript 添加+;1到数组中单击的元素,javascript,arrays,reactjs,react-hooks,Javascript,Arrays,Reactjs,React Hooks,我得到了一个包含一些博客帖子的页面,我希望用户能够喜欢/竖起每个帖子,看看每个帖子有多少喜欢 现在,当我喜欢一个帖子时,所有的帖子都会得到相同数量的喜欢。我怎么会只喜欢我点击的帖子 以下是我的代码的相关部分: const [posts, setPosts] = useState([]) let [thumbsNumber, setThumbsNumber] = useState(0) const thumbsUp = (x) => { conso

我得到了一个包含一些博客帖子的页面,我希望用户能够喜欢/竖起每个帖子,看看每个帖子有多少喜欢

现在,当我喜欢一个帖子时,所有的帖子都会得到相同数量的喜欢。我怎么会只喜欢我点击的帖子

以下是我的代码的相关部分:


    const [posts, setPosts] = useState([])
    let [thumbsNumber, setThumbsNumber] = useState(0)

    const thumbsUp = (x) => {
        console.log('Clicked thumb: ', x)
        setThumbsNumber((thumbsNumber += 1))
    }


return (
        <div>
            {posts.map((post, index) => (
                <div key={index} style={{ marginBottom: '10px' }}>
                
                                <p style={{ float: 'right' }}>{thumbsNumber}</p>
                                <ThumbUpAltIcon
                                    className="thumbsUpBtn"
                                    onClick={() => thumbsUp(post.id)}
                                ></ThumbUpAltIcon>
                </div>
            ))}
        </div>


const[posts,setPosts]=useState([])
让[thumbsNumber,setThumbsNumber]=useState(0)
常数thumbsUp=(x)=>{
log('Clicked thumb:',x)
setThumbsNumber((thumbsNumber+=1))
}
返回(
{posts.map((post,index)=>(

{thumbsumber}

thumbsUp(post.id)} > ))}
拇指号码应该是一个对象,设置号码时,应该添加/更新帖子的键(
id

注意:如果未定义
thumbsumber[id]
,我将使用
??0
替换0

const [posts, setPosts] = useState([])
const [thumbsNumber, setThumbsNumber] = useState({})

const thumbsUp = (id) => {
  console.log('Clicked thumb: ', id)
  setThumbsNumber(thumbs => ({
    ...thumbs,
    [id]: (thumbs[id] ?? 0) + 1
  }))
}


return (
  <div>
    {posts.map((post, index) => (
    <div key={index} style={{ marginBottom: '10px' }}>
      <p style={{ float: 'right' }}>{thumbsNumber[post.id] ?? 0}</p>
      <ThumbUpAltIcon className="thumbsUpBtn" onClick={()=> thumbsUp(post.id)} >
      </ThumbUpAltIcon>
    </div>
    ))}
  </div>
)
const[posts,setPosts]=useState([]
const[thumbsNumber,setThumbsNumber]=useState({})
常量thumbsUp=(id)=>{
log('Clicked thumb:',id)
setThumbsNumber(拇指=>({
…拇指,
[id]:(拇指[id]?0)+1
}))
}
返回(
{posts.map((post,index)=>(

{thumbsumber[post.id]?-0}

thumbsUp(post.id)}> ))} )
例如,你必须在每篇文章中添加like的编号

{
  id: 2,
  title: "name",
  ...,
  likes: 1,
}
然后你必须增加喜欢的数量

setPosts([...posts, {this field object with new likes number}])

我会把每个帖子都放在里面,里面有很多喜欢的东西。 例如,这是一篇文章:

{id: 1 ,name: 'post1', data: 'this is post' , numberOfLikes: 0}
然后根据帖子的id更新喜欢的数量