How to remove hashtag on url

Post Reply
syahirdev
Posts: 1
Joined: 04 May 2021, 18:50

04 May 2021, 18:57

Hello. I want to ask about the router used in the diamond template. How can I remove the hashtag '#' that attached into the url?
And if my router are like

Code: Select all

 '/animal/dog/:id' 
how can I make the breadcrumb shown at the AppTopBar to just show 'Dog'? currently it showing the full label like this

Code: Select all

'animal/dog/1'

mert.sincan
Posts: 5238
Joined: 29 Jun 2013, 12:38

05 May 2021, 16:13

Hi,

This issue is related to react-router. I think you need to add browserHistory for it. Please examine this link;
https://stackoverflow.com/questions/351 ... act-router

Best Regards,

yampan
Posts: 6
Joined: 09 Oct 2022, 16:26

29 Nov 2022, 06:17

Would it be easier to use BrowserRouter instead of HashRouter to remove the # in the URL?

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

29 Nov 2022, 09:58

Hi there!

We are not having any issues while we changed from HashRouter to BrowserRouter. You can remove the # in the URL with BrowserRouter.

Thank you,
Best

yampan
Posts: 6
Joined: 09 Oct 2022, 16:26

01 Dec 2022, 17:20

syahirdev wrote:
04 May 2021, 18:57
Hello. I want to ask about the router used in the diamond template. How can I remove the hashtag '#' that attached into the url?
And if my router are like

Code: Select all

 '/animal/dog/:id' 
how can I make the breadcrumb shown at the AppTopBar to just show 'Dog'? currently it showing the full label like this

Code: Select all

'animal/dog/1'
I have a workaround, but it may not be what you what exactly. Nevertheless, it will look reasonable to the users.

In breadcrumb.js, change

Code: Select all

const label = props.meta.label;
return <>{location.pathname === '/' ? <span>Current Working</span> : <span>{label}</span>}</> 
to

Code: Select all

// using the replace function
const label = props.meta.label; 
return <>{location.pathname === '/' ? <span>Current Working</span> : <span>{label.replace(':id', '')}</span>}</> // expected output -> /animal/dog/
Then add a <h5>Producy ID: {id}</h5> in the component

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

02 Dec 2022, 11:19

Hey again!
Thank you for your example
Best

Post Reply

Return to “Diamond - PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest