TabMenu with Redux

UI Components for React
Post Reply
hemmoi
Posts: 2
Joined: 27 Sep 2018, 09:05

07 Jan 2019, 15:10

Hi,

is there a way to use TabMenu with Redux store instead of the local component state? The following code works when you are navigating with the TabMenu, but it does not work if you call updatePage action from somewhere else in the application. Is it even possible and what is the value that should be stored in the store?

The problem that I'm trying to solve is:
- If I navigate to a different page using some other method than TabMenu, then a wrong tab is highlighted.
- If I reload some page then the first TabMenu option is always highlighted, even if I am in a different page.

Code: Select all

import React, { Component } from "react";
import { withRouter } from 'react-router-dom';
import { connect } from 'react-redux';
import { TabMenu } from 'primereact/tabmenu';
import { updatePage } from '../actions/mainNavigation';

class MainNavigation extends Component {
    constructor() {
        super();
        this.state = {
            items: [
                { label: "Dashboard", icon: 'pi pi-fw pi-home', command: () => { this.props.history.push(`/dashboard`) } },
                { label: "Devices", icon: 'fa fa-hdd', command: () => { this.props.history.push(`/devices`) } },
            ]
        };
    }

    render() {
        return (
            <TabMenu model={this.state.items} activeItem={this.props.activeItem} onTabChange={(e) => { this.props.updatePage(e.value) }} />
        )
    }
}

const mapStateToProps = (state) => {
    const activeItem = state.mainNavigation.activeItem || null;
    return { activeItem };
}

export default withRouter(connect(mapStateToProps, { updatePage })(MainNavigation));

merve7
Posts: 482
Joined: 12 Sep 2017, 10:44

08 Jan 2019, 11:12

Hi,
We will try your code and offer a solution for you.

hemmoi
Posts: 2
Joined: 27 Sep 2018, 09:05

24 Jan 2019, 12:59

Has there been any progress with this?

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest