-
Notifications
You must be signed in to change notification settings - Fork 4.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Tabular menu items do not display special characters #1340
Comments
Hi levithomason, but look it does not display the special characters in this example. |
Ah, I see. Yes, this is because if no To keep them, you should explicitly set the The import React, { Component } from 'react'
import { Menu } from 'semantic-ui-react'
export default class MenuExampleNameProp extends Component {
state = {}
handleItemClick = (e, { name }) => this.setState({ activeItem: name })
render() {
const { activeItem } = this.state
return (
<Menu>
<Menu.Item
name='editorials'
active={activeItem === 'Editorials'}
onClick={this.handleItemClick}
/>
<Menu.Item
name='reviews'
active={activeItem === 'Reviews'}
onClick={this.handleItemClick}
/>
<Menu.Item
name='upcomingEvents'
active={activeItem === 'upcomingEvents'}
onClick={this.handleItemClick}
/>
</Menu>
)
}
} Notice also how these names are camelCased, but the menu displays them Start Cased in the rendered items. |
BTW, this is confusing for sure. I'm open to redesign here. Less magic and more explicit would be good. I'm not sure we even need a name prop at all in this workflow. I don't have time for it, but I would support an effor to clean this up, making it more simple, more explicit, and not transforming values like this. |
However Levi, it works thanks a ton! |
Just burned a few hours before finding this issue. Would be great if name works with utf-8! |
PRs welcome! See the CONTRIBUTING.md setup and more info. |
How Can I set the content of each tab? There are no examples of it. |
Usage questions are best answered on gitter, see link in the README badges. That said, I'm not exactly sure what you are asking. |
The code above will render Tabs labeled with "Ubersicht", "Wurstchen" and "Larchen".
The text was updated successfully, but these errors were encountered: