Primereact - Link to is not working in Menubar command function

UI Components for React
Post Reply
gez2gel
Posts: 5
Joined: 25 Mar 2023, 15:56

27 Mar 2023, 10:16

Hi,
when I call <Link to "/component-path"/> inside menubar command function not working.

{
label: 'Home',
icon: 'pi pi-fw pi-bookmark',

command: () =>{

<Link to='/home'/>
}


},

primereact version is 9.2.1

habubey
Posts: 89
Joined: 24 Aug 2022, 13:17

28 Mar 2023, 10:11

Hey there!, Can you try this? Best

Code: Select all

import { useRouter } from 'next/router';
    export function BasicDoc(props) {
        const router = useRouter();
    
        const items = [
            {
                label: 'Quit',
                icon: 'pi pi-fw pi-power-off',
                command: (e) => {
                    router.push('/');
                }
            }
        ];
        
        
            return (
            <>
                <div className="card relative z-2">
                    <Menubar model={items} />
                </div>
            </>
        );
    }
Bugra Beyduz
PrimeReact Core Developer
Github profile: https://github.com/habubey

gez2gel
Posts: 5
Joined: 25 Mar 2023, 15:56

28 Mar 2023, 15:29

Dear Bugra,
thank you for your time and support.
After installed next-routes/next.js, and implement your code, nothing is displayed on a page. From page DevTool, I got:
Uncaught ReferenceError: process is not defined
at node_modules/next/dist/client/has-base-path.js (has-base-path.ts:3:19)
at __require (chunk-TWLJ45QX.js?v=82d03fe9:8:50)
at node_modules/next/dist/client/remove-base-path.js (remove-base-path.ts:1:46)
at __require (chunk-TWLJ45QX.js?v=82d03fe9:8:50)
at node_modules/next/dist/shared/lib/router/utils/resolve-rewrites.js (resolve-rewrites.ts:7:69)
at __require (chunk-TWLJ45QX.js?v=82d03fe9:8:50)
at node_modules/next/dist/shared/lib/router/router.js (router.ts:32:55)
at __require (chunk-TWLJ45QX.js?v=82d03fe9:8:50)
at node_modules/next/dist/client/router.js (router.ts:3:49)
at __require (chunk-TWLJ45QX.js?v=82d03fe9:8:50)

BR,

habubey
Posts: 89
Joined: 24 Aug 2022, 13:17

29 Mar 2023, 10:58

Hello there!
However, I've tested it on my local environment and it's working fine. If you clone our repo (primereact) and start it, please make sure you're in the http://localhost:3000/menu/#popup URL. That's what you're looking for, and you can also implement it in the menubar if you wish to.
Bugra Beyduz
PrimeReact Core Developer
Github profile: https://github.com/habubey

gez2gel
Posts: 5
Joined: 25 Mar 2023, 15:56

30 Mar 2023, 10:40

Dear Bugra,
The black page is due to adding 'const router = useRouter()', not because of Primereact. I think there will be a clash between next-route package and package that I use from my framework (I am using hilla.dev framework). Is there any other option than next/router | next to implement navigation logic inside menubar command function?
BR,
Gezahegn

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

31 Mar 2023, 13:11

I think you need to check with the Hilla.Dev guys and find out what the `<Link>` source code does and do the same thing in code.

Because you are rendering a Link but what you want is to "execute" a navigation.
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

gez2gel
Posts: 5
Joined: 25 Mar 2023, 15:56

08 May 2023, 20:38

<Link> is from react-router-dom library, not from hilla.dev.

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

08 May 2023, 21:01

Yes if you want to navigate using React Router you don't do it like that you do this...

Code: Select all

import { useNavigate } from 'react-router-dom';

const navigate = useNavigate();
...


{
	label: 'Home',
	visible: true,
	command: () => {
		navigate('/home');
	}
},

PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests