The user experience for having a dropdown list on a small screen (mobile) is very bad using react bootstrap dropdown list.
Are there any library for this case some kind of action sheet that looks more like a natively for reactjs.
Is it possible to integrate any library that uses html,css,javascript in React?
Okay so after the Discussion I think we found the Perfect Solution for your question.
You can use this like ->
import Actionsheet from 'react-actionsheet';
class App extends Component {
state = {
show: false
}
onClick = () => {
const { show } = this.state
this.setState({show: !show})
}
onRequestClose = () => {
this.onClick()
}
render() {
const { show } = this.state
const tip = show ? '隐藏' : '显示'
const menus = [{content: '点我'}, {content: '不要点我'}]
return (
<div>
<button onClick={this.onClick}>{tip}</button>
<Actionsheet show={show} menus={menus} onRequestClose={this.onRequestClose} />
</div>
)
}
}
This will render the UI like this
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.