React Router Compatibility
LI.FI Widget is fully compatible with React Router v6 and uses it internally for page navigation.

React Router

In order to operate correctly inside your instance of the React Router context, we check if the widget component is inside the context and if so utilize it instead of creating a new one.
The below code shows how to correctly set the path to a page with the widget component.
Please pay attention to the asterisk at the end of the path, it is necessary for the correct operation of the paths inside the widget.
<BrowserRouter>
<Routes>
<Route path="/swap/*" element={<LiFiWidgetPage />} />
</Routes>
</BrowserRouter>

Other Router

Well, if you don't use React Router in your app, you don't need to do anything. We will create a memory router inside the widget component, and all the page routing magic will happen internally.
Copy link