小编Geo*_*tty的帖子

Material-UI List作为Card的子项,触发所有onClick on main expand

Material-UI,Meteor,React

所以我想在卡片中嵌入带有onTouchTap(或onClick)功能的下拉列表.

它看起来工作正常,一切都没有麻烦 - 但是当您展开父卡时,同时在onTouchTap列表中的所有内容都会激活.

我已经厌倦了将其他卡片元素嵌入到彼此内部以达到相同的效果.

这仅仅是对代码的限制,还是有一些解决方法?

                    <Card>
            <CardHeader
                title={this.props.foodItem.foodName}
                subtitle={this.genPrtnImg()}
                avatar={this.props.foodItem.imgURL}
                actAsExpander={true}
                showExpandableButton={true}

            />
            <CardText expandable={true}>
                <List subheader="Item Requests">
                    <ListItem
                    primaryText={userName}
                    secondaryText={"Has requested " + prtNo + " portions"}
                    leftAvatar={<Avatar src="http://thesocialmediamonthly.com/wp-content/uploads/2015/08/photo.png" />}
                    primaryTogglesNestedList={true}
                    nestedItems={[
                         <ListItem
                            key={1}
                            primaryText="Accept"
                            leftIcon={<SvgIcons.ActionCheckCircle color='Green'/>}
                            onTouchTap={this.handleAccept(userName, prtNo)}
                         />,
                         <ListItem
                            key={2}
                            primaryText="Reject"
                            leftIcon={<SvgIcons.ContentBlock color='Red'/>} 
                            onTouchTap={this.handleReject(userName)}
                         />,
                    ]}

                />
              </List>
            </CardText>

              </Card>
Run Code Online (Sandbox Code Playgroud)

任何帮助将不胜感激,谢谢!

javascript jquery meteor reactjs material-ui

6
推荐指数
2
解决办法
3199
查看次数

标签 统计

javascript ×1

jquery ×1

material-ui ×1

meteor ×1

reactjs ×1