Skip to content
This repository was archived by the owner on Sep 20, 2023. It is now read-only.

Passing the clicked link to the trigger #256

Open
popeating opened this issue Jan 28, 2021 · 1 comment
Open

Passing the clicked link to the trigger #256

popeating opened this issue Jan 28, 2021 · 1 comment

Comments

@popeating
Copy link

I have the following scenario: the menu is generated dinamically and built this way:

{menu.nodes.map((D, i) => {
                    return (
                      <li
                        key={i}
                        ref={(el) => (LiRefs.current[i + 1] = el)}
                        className="list-none text-4xl md:text-6xl lg:text-8xl font-bold relative overflow-hidden uppercase pb-5"
                      >
                        <TransitionLink
                          ref={(el) => (LinkRefs.current[i + 1] = el)}
                          to={D.url}
                          exit={{
                            length: 1,
                            delay: 0.9,
                            trigger: ({ exit, node, e }) => exit_ani(exit, node),
                          }}
                          entry={{
                            delay: 0.9,
                            trigger: ({ entry, node, e }) =>
                              enter_ani(entry, node),
                          }}
                          className="hover:text-gray-600"
                          activeClassName="border-b-2 border-gray-600"
                          onClick={handleMenu}
                        >
                          {D.label}
                        </TransitionLink>
                      </li>
                    );
                  })}

the two animation triggers are animated with GSAP, my problem is that i dont know the page where i am and the page i want to go, so in my animation i have to animate event things that do not exists (this gives warnings); is there a way i can pass to the trigger the link i clicked?

@hawkstein
Copy link

Hey @popeating , you can pass any state you want to the trigger within the entry and exit props see the docs https://transitionlink.tylerbarnes.ca/docs/transitionlink/#props-and-options

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants