Vue Draggable - Multiple Lists

问题

I want to create something like a trello board where there are multiple columns and I can drag+drop items across different lists. I want to be able to create the columns dynamically since each user will have different number of lists. For vue-draggable, how can I dynamically create computed values for each list?

My data is in this format (which is a single array of lists):

lists: 
[
  {
    "id":1,
    "label":"List1"
    "items":[
      { "id": 1, "description: "item1" },
      { "id": 2, "description: "item2" },
    ]
  },
  {
    "id":2,
    "label":"List2",
    "items":[
      { "id": 3, "description: "item3" },
    ]
  },
  { ... },
  { ... }
]

But I need computed values for each list so I can drag/drop:

computed: {
  list1: {
    get() {
      return this.list1.items
    },
    set(value) {
      this.list1.items
    }
  },
  list2: {
    get() {
      return this.list2.items
    },
    set(value) {
      this.list2.items
    }
  }
}

Is there another approach for this scenario?

来源：https://stackoverflow.com/questions/54205985/vue-draggable-multiple-lists