useNavigation

how to remove params http://localhost:5173/masterdata/country/create to http://localhost:5173/masterdata/country

5 Replies

kapa.ai•14mo ago

Hi @hoaanhtuc. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In Refine, you can use the replace method from the useNavigation hook to replace the current entry on the history stack. This method uses the replace method of the useHistory from the routerProvider. Here's how you can use it:

import { useNavigation } from "@refinedev/core";  
  
const { replace } = useNavigation();  
  
replace("/masterdata/country"); // It navigates to the `/masterdata/country` page

import { useNavigation } from "@refinedev/core";  
  
const { replace } = useNavigation();  
  
replace("/masterdata/country"); // It navigates to the `/masterdata/country` page

This will replace the current URL (<http://localhost:5173/masterdata/country/create>) with the specified URL (<http://localhost:5173/masterdata/country>), effectively removing the create parameter. Please note that the replace method parameters are dependent on your router provider. For more information, you can check the official documentation here (https://refine.dev/docs/core/hooks/navigation/use-navigation/#replace). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•14mo ago

<@617879699363725341> kapa.ai is still learning and improving, please let us know how it did by reacting below

rising-crimsonOP•14mo ago

  const { formProps, modalProps, close, onFinish } = useModalForm<any>({
    resource: api,
    action,
    id: idDetail || params.id,
    defaultVisible: true,
    redirect,
    onMutationSuccess: (data) => {
      replace("masterdata/country")

  const { formProps, modalProps, close, onFinish } = useModalForm<any>({
    resource: api,
    action,
    id: idDetail || params.id,
    defaultVisible: true,
    redirect,
    onMutationSuccess: (data) => {
      replace("masterdata/country")

replace it doesn't work @kapa.ai

kapa.ai•14mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- The replace method is part of the useNavigation hook, so you need to make sure you've imported and initialized it correctly in your component. Here's how you can do it:

import { useNavigation } from "@refinedev/core";  
import { useModalForm } from "@refinedev/react-hook-form";

const { replace } = useNavigation();

const { formProps, modalProps, close, onFinish } = useModalForm<any>({
    resource: api,
    action,
    id: idDetail || params.id,
    defaultVisible: true,
    redirect,
    onMutationSuccess: (data) => {
      replace("masterdata/country")
    },
});

import { useNavigation } from "@refinedev/core";  
import { useModalForm } from "@refinedev/react-hook-form";

const { replace } = useNavigation();

const { formProps, modalProps, close, onFinish } = useModalForm<any>({
    resource: api,
    action,
    id: idDetail || params.id,
    defaultVisible: true,
    redirect,
    onMutationSuccess: (data) => {
      replace("masterdata/country")
    },
});

In this example, replace("masterdata/country") will replace the current URL with /masterdata/country when the mutation is successful. If it's still not working, there might be an issue with your router provider or the way you've set up your routes. The parameters for the replace method are dependent on your router provider. For more information, you can check the official documentation here (https://refine.dev/docs/core/hooks/navigation/use-navigation/#replace). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•14mo ago

<@617879699363725341> kapa.ai is still learning and improving, please let us know how it did by reacting below

useNavigation

Did you find this page helpful?