How to bind a reference field to a symbol

Technical Questions
7

Okey!

My only question is now, how can I bind the id dynamically:

image
image974×522 13 KB

So here I bind my reference, and the id will be state.hero.id after I choose an entry:

And in my API data source I try:
https://cdn.builder.io/api/v2/content/hero?apiKey=32f148657e2646be8562eb4e6ebfa190&query.id={state.hero.id}&limit=1&includeRefs=true

But neither {state.hero.id} nor ${state.hero.id} work, can you please help me how could I pass that info to my api call?

Side note:
I also tried this way, but no success, please point me in the right direction with api data source

async function main () {
  if (Builder.isServer) {
  let id=state.hero.id

  fetch('https://cdn.builder.io/api/v2/content/hero?apiKey=32f148657e2646be8562eb4e6ebfa190&query.id=' +id + '&limit=1&includeRefs=true')
  .then(response => response.json())
  .then(data => state.test=data);
  }

}

export default main();