Svelte: Component "Link" property "routeProps"

thebestgin · August 27, 2020, 11:50pm

Unfortunately, I don’t understand how I have to implement the “routeProps” property of the “Link” component.

How can I get to the routeProps in a “page”?

The routeProps do not have the following variables:
export let f7Router;
export let f7route;

Many thanks,
Sebastian

uslualper · August 28, 2020, 8:45am

In such cases, taking care of the compounds themselves makes your job easier.

github.com

framework7io/framework7/blob/master/packages/svelte/components/link.svelte

<script>
  import { createEventDispatcher, onMount, afterUpdate, onDestroy } from 'svelte';
  import Mixins from '../utils/mixins';
  import Utils from '../utils/utils';
  import restProps from '../utils/rest-props';
  import f7 from '../utils/f7';
  import hasSlots from '../utils/has-slots';

  import Badge from './badge.svelte';
  import Icon from './icon.svelte';

  const dispatch = createEventDispatcher();

  let className = undefined;
  export { className as class };

  export let noLinkClass = false;
  export let text = undefined;
  export let tabLink = undefined;
  export let tabLinkActive = false;

This file has been truncated. show original

As far as I understand from this component, it comes to the page with the data on the route. But I tested it, I can’t access the data. @nolimits4web

https://framework7.io/svelte/navigation-router.html

nolimits4web · August 28, 2020, 9:53am

<Link href="/somepage/" routeProps={{ foo: 'bar' }} ...

In page component for “/somepage/” path:

<script>
  ...
  export let foo;

  console.log(foo) // -> 'bar'
</script>

uslualper · August 28, 2020, 9:57am

Thanks for the answer. It’s my fault. I tried again and it works

thebestgin · August 28, 2020, 10:14am

It really works that simple. Thank you both.