Search code examples
vue.jsmarkdowngridsome

writing markdown for gridsome. Is array of objects possible?


I'm using a website with Gridsome and I use markdown files to feed content to the website.

I have little experience with markdown. While I don't really understand how md files work, I managed to get it working with a few tutorials until I started adding arrays into the md file see below.

content/home/index.md

---
metaTitle: this is the meta title tag
metaDescription: metadescription
someArray: [alpha, beta, delta] //I tried adding an array like this and it worked fine
imgArray: [{url: "someurl", alt: "some alt", caption: "some caption}, {url: "someurl", alt: "some alt", caption: "some caption}] //this did not work and caused an error
---

my question is whether adding an array of objects in markdown files possible? if it is, how do I write it? thanks very much!


Solution

  • In your YAML, the array is invalid in that it's missing quotes after some caption.


    The section of metadata you're describing is the YAML frontmatter, and it's not specific to Gridsome or Vue.

    Yes, object arrays are allowed in YAML either as comma-separated objects:

    imgArray2: [
     {url: "someurl", alt: "some alt", caption: "some caption"},
     {url: "someurl", alt: "some alt", caption: "some caption"}
    ]
    

    demo

    ...or as lists, where each element starts on a new line with a hyphen prefix:

    imgArray:
     - {url: "someurl", alt: "some alt", caption: "some caption"}
     - {url: "someurl", alt: "some alt", caption: "some caption"}
    

    demo