Monaca Onsen UI Discord Chat Github Repo

Possible to keep ListItem highlighted after tap?

  • I’m trying to use the List/ListItem classes for a master detail type of UI. Is it possible to keep a ListItem highlighted after it’s tapped…in other words when it’s the active selection in a list of items?



  • Well…it turned out to be really easy.

    const modifiers = ( this.props.selection.job === item ) ? "longdivider selected" : "longdivider";
    return (
    	<ListItem key={index} modifier={modifiers} tappable={true} .....

    That’s about it. I added some new CSS that defines the selected modifier to set the background appropriately. And then just set the modifiers for the ListItem when it’s selected. It all just works and it was very straightforward.