How to reactively specify images

[joshbmarshall]

Hi I have a blog post I am trying to get the image.

Here is my code:

useSchemaOrg([
  defineArticle({
    image: computed(() => post.value.image.url),
    description: computed(() => post.value.meta_description),
    headline: computed(() => post.value.name),
  }),
])

The description and headline are inserted in the output correctly. The image links to primaryImage but in there, the url is not showing. If I replace the computed() with the actual url as a string it works well. If I add a customer element e.g. image2 with the same content as image, then it gets inserted as expected.

None of the examples show how to get the data in there from variables that haven't been loaded via ajax yet. Any help appreciated :)

[joshistoast]

I've run into this as well, seems that the module behaves similarly to definePageMeta, would be nice to have the ability to plug in dynamic data here.

[harlan-zw]

Hey, thanks for flagging this issue.

I'll be looking to do a major overhaul of the node defines/resolving which will improve the reactivity significantly and reduce the package size. Should be done within the week

Keep in mind though, if you're changing schema data at runtime Google may not see the updates, so it's best if your SSR schema contains all the right data. (assuming you're using SSR).

[harlan-zw]

Hey guys, with the release of v1 these reactivity issues should be fixed:

• The fields are now properly typed for reactivity
• Any reactive updates will re-generate the schema

If you find this isn't the case please create a new issue with code to reproduce