Chartjs 双条形图不能有多个同名属性答案

【问题标题】：Chartjs double bar chart cannot have multiple properties with the same nameChartjs 双条形图不能有多个同名属性
【发布时间】：2019-08-08 13:37:10
【问题描述】：

我正在尝试使用 Typescript 在 React.js 中绘制双条形图，但是我收到错误消息“在严格模式下，对象文字不能具有多个同名的属性”。奇怪的是错误只在属性 backgroundColor 上，即使所有其他属性都具有相同的名称。

我试图在我的 tsconfig,json 文件中将 'strict' 设置为 false，但是当我使用 npm start 时，它会通过以下消息设置回 true：

The following changes are being made to your tsconfig.json file:
  - compilerOptions.strict to be suggested value: true (this can be changed)

这是我用来在 chart.js 中设置图表选项的代码

datasets: [
                    {
                          label: "Surveys Started",
                          backgroundColor: gradientFill,
                          borderColor: "#f96332",
                          pointBorderColor: "#FFF",
                          pointBackgroundColor: "#FFF",
                          backgroundColor: '#FF3333',
                          pointBorderWidth: 2,
                          pointHoverRadius: 4,
                          pointHoverBorderWidth: 1,
                          pointRadius: 4,
                          fill: true,
                          borderWidth: 1,
                          data: this.state.data[0]
                        },
                    {
                        label: "Surveys Completed",
                        backgroundColor: gradientFill,
                        pointBackgroundColor: "#2CA8FF",
                        backgroundColor: '#3733FF',
                        pointBorderWidth: 2,
                        pointHoverRadius: 4,
                        pointHoverBorderWidth: 1,
                        pointRadius: 4,
                        fill: true,
                        borderWidth: 1,
                        data: this.state.data[1]
                    }

【问题讨论】：

标签： reactjs typescript react-chartjs

【解决方案1】：

gradientFill 变量本身似乎存在问题。

注释掉gradientFill变量，用字符串设置backgroundColor（例如'#fff'），看看错误是否消失。如果是，请查看gradientFill 的实现。

【讨论】：