首页 > 解决方案 > react-native 多选更改选择文本颜色

问题描述

我是 react-native 的新手,我正在尝试将多选组件添加到我的应用程序中,我的代码如下:

   <SectionedMultiSelect
              items={this.state.days}
              uniqueKey="id"
              hideSearch={true}
              subKey="day"
              selectText="Select Days"
              selectToggle={{ color: '#f79334' }}
              showDropDowns={true}
              readOnlyHeadings={true}
              onSelectedItemsChange={this.onSelectedItemsChangeHomeRepair}
              selectedItems={this.state.selectedDaysHomeRepair}
              showChips={false}
              theme = {
                {
                  Colors:{ 
                    selectToggleTextColor:'#053075',
                    text:'#053075'
                   }
                }
              }
            />

有谁知道如何将颜色应用于“选择日期”文本。谢谢

标签: react-native

解决方案


您可以使用该renderSelectText道具并使用您的自定义样式传递您自己的文本组件。

<SectionedMultiSelect
  items={this.state.days}
  uniqueKey="id"
  hideSearch={true}
  subKey="day"
  renderSelectText={() => <Text style={{ color: 'red', fontSize: 24 }}>Select Days</Text>}
  selectToggle={{ color: '#f79334' }}
  showDropDowns={true}
  readOnlyHeadings={true}
  onSelectedItemsChange={this.onSelectedItemsChangeHomeRepair}
  selectedItems={this.state.selectedDaysHomeRepair}
  showChips={false}
  theme = {
    {
      Colors: { 
        selectToggleTextColor:'#053075',
        text:'#053075'
      }
    }
  }
/>

看看如何在此处的示例中使用它。


推荐阅读