2016-12-14 6 views
0

Clickイベントのリストアイテムにクラスを追加するのに役立つ人はいますか?これまでのところ私はrefs属性にアクセスして、それを試してみました:クリックしたリストアイテムにクラスを追加するには

<li className="existing-class" refs={ name } onClick={ this.sort.bind(this, name) }>Foo</li> 

@action sort = (name) => { 
    this.refs.name.className="existing-class another-class" 
} 

しかし、これは動作していない...誰かが助けることができますか?

ありがとうございます!

+0

重複質問を行うことがありますか? - http://stackoverflow.com/questions/36317933/how-to-add-a-css-class-to-an-element-on-click-react – adityap

答えて

1

既存のソリューションにパッチを適用するだけで、動的nameプロパティ(this.refs[name].className="some-class")に正しくアクセスしてください。

React-yソリューションの場合は、liの親コンポーネントに状態がクリックされているかどうかを保存してから、親の状態に基づいてclassNameを設定する必要があります。

+0

gotcha - 私の質問と私のコードを反映するための例を更新more正確に... –

+0

OK、それは私の答えに全く影響を与えるとは思わない。 – Scimonster

+0

まだ動作していません..私は 'this.refs [name] .className =" existing-class some-class'を試しましたが、何らかの理由で 'some-class'が追加されていませんでした... –

1

右のように、適切な方法は、clickイベントではなく、stateによって制御される要素のクラスを持つことです。

<li className={'existing-class ' + this.state.clicked ? 'some-class' : ''}>Foo</li>

とあなたのonClick機能がsetState({clicked: true})

関連する問題