如何使用semantic-ui-react Label OnRemove处理程序/ removeIcon属性?

时间:2018-03-06 00:26:42

标签: semantic-ui-react

我注意到semantic-ui-react标签有一个OnRemove处理程序和一个removeIcon属性。我想知道它应该如何与其他控件一起使用,因为它似乎没有很好地记录。例如,如何使用Input或Form.Input?

来使用它

1 个答案:

答案 0 :(得分:1)

这是一个用法示例:

class Rates extends Component {
constructor(props) {
    super(props);
    this.state = {
        dailyRatesDates: [],
        clicked: true,
    }
}
componentDidMount(){
    ... //calling API data and passing as setState to dailyRatesDates
} 

render() {
  return (
    <span>
      {this.state.dailyRatesDates.length > 0 &&
         <WrapperMobile> 
            {this.state.dailyRatesDates.map(function(i,index){
               return(
                  <div key={index}>
                     {i.rate_plans.map(function(j,index){
                        return(
                          <div key={index} className="expander">
                             <h2 onClick= {() => this.setState({clicked: !this.state.clicked})}>
                                <p>{j.name}</p>
                             </h2>
                             <div className={`expander__content ${this.state.clicked ? 'closed' : 'open'}`}>
                                ...
                             </div>
                          </div>
                        )
                      })}
                    </div>
                  )
                })}
             </WrapperMobile>
           </div>
         }
      </span>
    );
  }
}

enter image description here