Javascript 在对象方法中使用变量会导致；“未知格式”；

当我尝试使用本页提供的示例时，react在第一行使用

const color=chroma（data.color）返回“未知格式”

我不知道为什么这会发生在我这边。这很奇怪，因为它在他们的示例页面中工作得非常好

 const color = chroma(data.color);

第一步是将颜色输入chroma.js。这就是泛型构造函数chroma（）的作用。此函数尝试为您猜测输入颜色的格式。因此data.color需要有效的颜色

 colourStyles = {
    control: styles => ({ ...styles, backgroundColor: 'white' }),
    option: (styles, { data, isDisabled, isFocused, isSelected }) => {
      const color = chroma(data.color);
      return {
        ......
      };
    }

传递给选项的colorOption对象将作为数据-选项可用：（样式，{data，isDisabled，isFocused，isSelected}）。如果颜色选项对象中不存在该颜色，则会出现错误“未知格式”

注意：确保colorOptions中存在color属性

工作演示：
只是想知道您是否找到了解决方案？
 colourStyles = {
    control: styles => ({ ...styles, backgroundColor: 'white' }),
    option: (styles, { data, isDisabled, isFocused, isSelected }) => {
      const color = chroma(data.color);
      return {
        ......
      };
    }

<Select className="basic-single" classNamePrefix="select" defaultValue={colourOptions[0]}
isDisabled={isDisabled} isLoading={isLoading} isClearable={isClearable}
isRtl={isRtl} isSearchable={isSearchable} name="color" 
options={colourOptions} <!-- colourOptions object -->
styles={colourStyles} />

   colourOptions:[
        { value: 'ocean', label: 'Ocean', color: '#00B8D9', isFixed: true },
        { value: 'blue', label: 'Blue', color: '#0052CC', isDisabled: true },
        { value: 'purple', label: 'Purple', color: '#5243AA' },
        { value: 'red', label: 'Red', color: '#FF5630', isFixed: true },
        { value: 'orange', label: 'Orange', color: '#FF8B00' },
        { value: 'yellow', label: 'Yellow', color: '#FFC400' },
        { value: 'green', label: 'Green', color: '#36B37E' },
        { value: 'forest', label: 'Forest', color: '#00875A' },
        { value: 'slate', label: 'Slate', color: '#253858' },
        { value: 'silver', label: 'Silver', color: '#666666' },
      ]