Routes config on next-routes

Question

On my project, I'm using React + Next.js. For routes, I use the library next-routes. When you navigate the nested route "{category alias}/filter" the page reloads.

Add route - routes.add ({name: 'products', pattern: '/:noname/filter', page: 'products'})

Link to the route - <Link route="category_alias/filter">Products</ Link>

How to make it work without reloading?

Answer 1

I'm under the impression that you are still using the Link parameter inside the next/link

If that is so, then switch to using the Link object found the file where you export the next-routes

Assuming you have the routes.js file at the root of the project:

Then in a path like pages/test.js

import React from 'react';
import { Link } from '../routes';

export default function() {
    return (
        <Link route="/category_alias/filter">
            <a>Testing the microphone</a>
        </Link>
    );
}

See https://github.com/fridays/next-routes#on-the-client