onItemTap not working as expected

[addisonschultz]

haven't had time to triage this but wanted to log, I think there's a bug with passing data based on the examples we give with the data component at the moment

teddis-I'm new to Framer, love the potential but really stubbing my toes on smart components. I've got airtable populating a data component in a grid of "car thumb" components. I want to open a new page when I tap on an item. I see I can create interaction from the data component to a new page on tap, but it's dead, not working. And even then I'm not sure how to transfer the variables from the item to the new page, and how to connect those variables to items in the new page. Do I have to create more smart components on the second page to receive item variables on tap? I'm confused. Can't find quick, concise, relevant, detailed documentation on how to connect all this up. I'm following the April 2021 hour long video on smart components but it's glossing over things and the quality is too low (720p). Thanks for help in advance. Is there a link to a good help article on this?

wolfboypupp — Today at 10:47
Hello! did you by chance get to go over this example file? It should have a example and some code to show how to open a modal on click.. https://framer.com/projects/new?duplicate=fXHamZqD4CB4e80R0Ldu. in example 2 if you switch the transition type from modal to page, it might get you towards a step in the direction you are trying to take it

teddis — Today at 11:05
Thanks, I tried out the example. In Example #2 the image isn't being replaced with the item's that is clicked but the other variables are shown correctly.

wolfboypupp — Today at 11:25
no doubt, it does'nt work for me either, that may be a bug, but I don't know enough about code to try and edit it to work. @addisonschultz may be able to help or confirm if it is a known bug or not.

[beslagic]

You have to change one line in Example2_passData.tsx - code

Fix is simple:

find
const image = data.selectedItem ? data.selectedItem.product_image : ""

and replace to

const image = data.selectedItem ? data.selectedItem.productImage : ""