最近用React + Redux做前端頁面需要用到動態(tài)實現(xiàn)css, 示例代碼如下僅供參考:
import React, {Component} from 'react';
export default class extends Component {
constructor (props) {
super(props)
}
changeLang(currLang = 0) {
this.refs.langBtnList.style.minWidth = '110px';
this.refs.langBtnList.style.display == 'block' || this.refs.langBtnList.style.display == true ? this.refs.langBtnList.style.display = 'none' : this.refs.langBtnList.style.display = 'block';
if(currLang > 0 ){
console.log('currLang:', currLang)
}
}
render () {
return (
<li className="dropdown">
<a aria-expanded="false" role="button" className="dropdown-toggle" data-toggle="dropdown" onClick={ () => this.changeLang()}> 中文版 <span className="caret"></span></a>
<ul role="menu" className="dropdown-menu" ref='langBtnList'>
<li><a onClick={ () => this.changeLang(1)}>中文版</a></li>
<li><a onClick={ () => this.changeLang(2)}>英文版</a></li>
<li><a onClick={ () => this.changeLang(3)}>俄文版</a></li>
<li><a onClick={ () => this.changeLang(4)}>韓文版</a></li>
</ul>
</li>
)
}
}
結(jié)束語
對你有幫助或喜歡的話灼卢,歡迎關注绍哎、打賞,收藏鞋真,謝謝崇堰!