Skip to main content
Peter_Uithoven
Peter_Uithoven
June 26, 2023
Solved

Actions that set variables don't work on nested components?

  • June 26, 2023
  • 6 replies
  • 2969 views

When I assign an action to a nested instance in a component which sets a variable it doesn’t seem to work. The component’s variant changes, but the variable is never changed. There are no warnings or errors.

Screenshot from 2023-06-26 18.46.37@2x

When assigning the same action to the outer component it does set the variables.

Screenshot from 2023-06-26 18.47.10@2x

An example:

Figma – 26 Jun 23

This somehow feels related to the following limitation:

Variables can only be applied to top-level instances, and are not available for nested variant instances.

Mentioned here: Use variables in prototypes

    This topic has been closed for replies.
    Best answer by tank666

    Change the order of the actions so that “Set variable” is first in the list.

    6 replies

    tank666
    tank666Answer
    June 26, 2023

    Change the order of the actions so that “Set variable” is first in the list.

    UX/UI designer. Figma expert. Creator and developer of plugins and widgets for Figma and FigJam. Check out my resources in Figma Community: figma.com/@tank
      Peter_Uithoven
      Peter_UithovenAuthor
      June 26, 2023

      Thanks @tank666 that works!

        Shachar_Sherizly
        Shachar_Sherizly
        New Member
        July 10, 2023

        Figma, Variables is a great idea and a step forward, but in its current state it’s very limited so much that it misses the point. For example, using variables and the new ‘wrap’ auto-layout, I managed to reduce 8 component variants to 1 frame. But, I am not able to turn this frame into a component since it contains two (nested) components, to which I wanted to be able to assign a variable to auto set THEIR selected variant… I know this is confusing, but the point is, VARIABLES should work EVERYWHERE, including nested components, otherwise in many cases it’s unusable. Is there a plan to fix this in the future?

          David_Black1
          August 25, 2023

          thank you! Thank you!

          3-2-1-John
          3-2-1-John
          New Member
          August 30, 2024

          Also, this does not seem to work on non-component, nested frames. I was attempting to create a drop-down list to filter search results and none of the interactions on the nested frames (list items) were getting triggered. FYI, I was only using Set Variable with each of the interactions.

          layers

          dropdown

          berzollaj
          berzollaj
          New Member
          February 11, 2025

          this is a really unfortunate issue. The nav 2 and nav 3 switch back to the Nav 1 title when using the variable to control the state: (on mouse down, set the variable of the state of nav2 and nav3 to default) - any way around this?

           

           

          Also should mention, after buttons 2 and 3 switch to the language Nav 1, if i mouse over those buttons they do go back to the Nav 2 and 3 titles, its the initial state that goes back to the original instance labels

           

          thanks for any help on this...

          Terms & ConditionsAccessibility statement