reactjs React没有正确地有条件地渲染列出的元素,你如何有条件地渲染列出的项目？

1dkrff03 于 2023-04-11 发布在 React

关注(0)|答案(1)|浏览(107)

我知道将tickets.changeToggle设置为true（在第2行）将在段落html中显示“hi”
我知道点击按钮会改变门票。changeToggle为true或false，这取决于每个列出的项目的当前值。
我的问题是改变票.changeToggle不删除“hi”在下面的例子.即使它是假的.我只是setState，但我想只改变它的票点击.我想我可以设置一个数组，并跟踪状态的索引，但这似乎是错误的方式去.有什么想法怎么办？

{tickets.map((tickets) => {
            tickets.changeToggle = true;
            <button onClick={() => {tickets.changeToggle = !tickets.changeToggle}>Chg</button>
            <p>{tickets.changeToggle && 'hi'}</p>

reactjs

来源：https://stackoverflow.com/questions/75979343/react-is-not-conditionally-rendering-in-listed-elements-correctly-how-do-you-co

1条答案

按热度按时间

qojgxg4l1#

你需要将HTML Package 在括号和return中，因为你使用的是一个带块的lambda：

{tickets.map((tickets) => {
            tickets.changeToggle = true;
            return (
                 <button onClick={() => {tickets.changeToggle = !tickets.changeToggle}>Chg</button>
                 <p>{tickets.changeToggle && 'hi'}</p>
            )
    })
}

另外，在map表达式中改变数据是一个可怕的想法，不要这样做。

赞(0）回复(0）举报 2023-04-11

我来回答

reactjs React没有正确地有条件地渲染列出的元素,你如何有条件地渲染列出的项目？

1条答案

相关问题

热门标签

最新问答