Question

我的问题是这样的：我正在使用“map”渲染一系列项目。每个渲染的项目还包括我创建的切换按钮组件。您可以将其称为常规复选框。复选框值将决定渲染的项目是否具有特定的css类，并带有过渡。

这就是问题所在。在状态更改时，我更新整个列表。因此，整个列表正在重新呈现。因此，我得到相关的项目与相关的布尔值。尽管如此，这个项目没有被修改，它被重新渲染，所以css不会从A变为B，它只是获得一个新的css类而不是之前的，所以TRANSITION不起作用。

渲染的数组：

import requests
from bs4 import BeautifulSoup

WIKI_URL = "https://en.wikipedia.org/wiki/List_of_volcanoes_by_elevation"

req = requests.get(WIKI_URL)
soup = BeautifulSoup(req.content, 'lxml')
table_classes = {"class": ["sortable", "plainrowheaders"]}
wikitables = soup.findAll("table", table_classes)

print(wikitables)

更新功能：

            {this.state.extensions.map((curr,index)=>{
            return <div className="single-extension" key={'extension-' + Utils.guid()}>
                <div className="toggle-area">
                    <ToggleButton onChange={(value)=>{
                        this.handleAssociateExtension(index,value);
                    }} active={curr.associated}/>
                </div>
                <div className={ClassNames({'details':true, 'on': curr.associated})}>
                    <div className="link-text">{curr.link_text}</div>
                    <div className="description">{curr.description}</div>
                    <div className="landing-page">{curr.landing_page}</div>
                </div>
            </div>
        })}

提前谢谢！：）

React - 在数组中修改单个项目后渲染

0 个答案: