How to add array to vue-kanban blocks

Question

I'm implementing vue-kanban component in my web application. There I'd like to display some objects from my database but I need some help to add them to the kanban board.

This is my array with the projects:

props: {
  projects: {
    type: Array,
    required: true,
  }
},

And here I'd like to add them to the kanban board, it should be instead of blocks :

data() {
  return {
    stages: ['open', 'doing', 'close'],
    blocks: [
      {
        id: 1,
        status: 'open',
        title: 'test',
      },
    ],
  };
}

I use that component: https://github.com/BrockReece/vue-kanban

Answer 1

See What's the correct way to pass props as initial data in Vue.js 2?

If the Kanban component is expecting an attribute like :blocks="[...]" and nothing is going to happen to the data can you not pass the projects array directly to it? eg :blocks="projects"

If no and the data name blocks is a must and the data needs to be mutable then see below.

 export default { name: "YourComponent", props: { projects: { type: Array, required: true } }, data() { return { blocks: this.projects } } }