根据特定元素设置状态

Posted

技术标签:

【中文标题】根据特定元素设置状态【英文标题】:Set state based on particular element 【发布时间】:2018-12-09 11:49:36 【问题描述】:

我有 3 个链接,我想在单击元素时更改链接的文本,但它会影响那里的所有链接,当我单击链接时,所有链接都会更改为 back,但我想要只有那个链接会改变,请问我该怎么做

 class Apps extends Component 
constructor(props) 
    super(props);
    // Don't do this!
    this.state =  showing: true, word: false ;


render() 
    return (
        <div>
         <div className="container">
            <div style= display: (this.state.showing ? 'block' : 'none') >A Single Page web application
             made with react</div>
         </div>
            <div className="buttons">
                <a href='' ref="login" onClick=this.onclick.bind(this) >this.state.word ? 'back' : 'Login'</a><br/><a href='' onClick=this.onclick.bind(this)>this.state.word ? 'back' : 'Signup'</a><br />
                <a href='' onClick=this.onclick.bind(this)>this.state.word ? 'back' : 'Members'</a>
            </div>

        </div>
    );

onclick(e)
    e.preventDefault();
    this.setState(showing: !this.state.showing);
    this.setState(word: !this.state.word);

;

【问题讨论】:

【参考方案1】:

您可以将链接重构为具有自己状态的单独组件。

【讨论】:

以上是关于根据特定元素设置状态的主要内容,如果未能解决你的问题,请参考以下文章

有没有办法根据 flex-wrap 状态来设置元素的样式?

根据 React 功能组件中的状态变量有条件地设置 className

使用 *ngFor 时如何仅将类设置为特定元素?

AngularJS根据另一个元素设置元素固定位置

Flutter web - 根据url设置状态[关闭]

Gridview 根据 Android 中的 SQLITE 状态高亮显示特定项目