Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue with dynamic routes

See original GitHub issue

Hi,

Thanks for this barba alternative=)

Currently testing it out but I’m having one issue. Links to Dynamic pages (Wordpress single pages) doesn’t work properly. It works the first click/entry after a page refresh, but going between pages and then trying to enter a dynamic route causes a hard refresh. Any idea why?

import '../css/app.scss'

import Highway from '@dogstudio/highway'

// Renderers
import Home from './home'
import Location from './location'

(() => {
	const links = [...document.querySelectorAll('.js-site-head__menu-link')]

	const H = new Highway.Core({
		renderers: {
			home: Home,
			location: Location
		},
		transitions: {

		}
	})

	H.on('NAVIGATE_IN', (from, state) => {
		for (const link of links) {
		  link.classList.remove('is-active')

		  if (link.href === state.url) {
		    link.classList.add('is-active')
		  }
		}
	})
})();

Single renderer:

import Highway from '@dogstudio/highway'
import Smooth from '../scroll'

let smooth

class Location extends Highway.Renderer {
	onEnter() {
		smooth = new Smooth()

		smooth.init()
	}
	onLeave() {
		smooth.destroy()
	}
	onEnterCompleted() { }
	onLeaveCompleted() { }
}

export default Location

Single page file (twig templating)

{% extends "base.twig" %}
{% block content %}
<article router-view="location" class="o-scroll js-scroll">
	<div class="o-scroll__content js-scroll__content">

	</div>
</article>
{% endblock %}

Issue Analytics

State:
Created 5 years ago
Comments:14 (10 by maintainers)

Top GitHub Comments

2reactions

deJongcommented, May 24, 2018

In addition to @jesperlandberg, there is always a hard refresh of the page once a link is loaded dynamically in the router view and clicked.

The transition works, but after about 100ms there is still a hard refresh.

Simple example:

<body>
   <main router-wrapper>
      <article router-view>

        <ul class='nav'>
         <li>
          <a href='#'>link</a> <!-- works when page is loaded normally but not when loaded by router view --!>
         <li>
        </ul>

      </article>
  </main>
</body>

0reactions

Anthodpntcommented, May 25, 2018

@deJong @jesperlandberg

Ok perfect! I’ll close the issue then. Don’t hesitate to share Highway.

Anthodpnt

Top Results From Across the Web

Dynamic Vehicle Routing Problem—Predictive and ... - MDPI

The Dynamic Vehicle Routing Problem (DVRP) is one of the most important problems in the area of enterprise logistics. DVRP problems involve these...

Recent dynamic vehicle routing problems: A survey

The Vehicle Routing Problem (VRP) was introduced in the literature by Dantzig and Ramser (1959), to describe the problem of finding a set...

Problem with dynamic route using react-router on ReactJS

I'm trying to implement dynamic route using react-router, I found that it works perfectly on npm start but then I tried on production...

issue with dynamic route · Issue #2213 · remix-run/react-router

The issue seems to be that when I type the dynamic routes directly, the css & script link in index.html see that dynamic...

Dynamic Routing - Gridsome

Pages with dynamic routes have lower priority than fixed routes. For example, if you have a /user/create and a /user/:id route, the /user/create ......