zunnzunn / vue-ganttastic

Simple, interactive and highly customizable Gantt chart component for Vue 3
https://zunnzunn.github.io/vue-ganttastic/
565 stars 141 forks source link

ganttBarConfig.style error: TypeError: Failed to set an indexed property [0] on 'CSSStyleDeclaration': Indexed property setter is not supported. #112

Open Lnncoco opened 4 months ago

Lnncoco commented 4 months ago

Following the official example, I added a style attribute in row1BarList.ganttBarConfig, but the browser reports an error: "TypeError: Failed to set an indexed property [0] on 'CSSStyleDeclaration': Indexed property setter is not supported."

https://zunnzunn.github.io/vue-ganttastic/getting-started.html

const row1BarList = ref([
  {
    myBeginDate: "2021-07-13 13:00",
    myEndDate: "2021-07-13 19:00",
    ganttBarConfig: {
      // each bar must have a nested ganttBarConfig object ...
      id: "unique-id-1", // ... and a unique "id" property
      label: "Lorem ipsum dolor",
      style: `background: red`
    }
  }
])

vue: 3.4.21 @infectoone/vue-ganttastic: 2.3.2

Pedrocanoas commented 4 months ago

style props need to be a object with css declarations

style: {
  background: 'red',
  borderRadius: '5px'
}
Lnncoco commented 4 months ago

Thank you. It's configured now. A suggestion, the official website's API: GGanttRow section does not include a description of GanttBarObject[]. One needs to delve into the source code or navigate to the Common use cases section to find this information, which is not very convenient for searching.