更改下拉菜单的标题 header

Question

我正在使用 react-native-dropdown-picker v 4.0.2;

我正在尝试更改标题，在这里我找到了默认值 select 一个项目，如何更改默认标题，例如 select一个类别

这是一个博览会 link https://snack.expo.io/@mamun_121/testing_snack

import React, { Component } from 'react'
import { View } from 'react-native'
import SelectMultiple from 'react-native-select-multiple'
import Icon from 'react-native-vector-icons/Feather';
import DropDownPicker from 'react-native-dropdown-picker';


class Dropdown extends Component {
  
  state = {
    items: ['sports']
  }
  
  render () {
    return (
      <DropDownPicker
        items={[
          {label: 'Sports', value: 'sports', icon: () => <Icon name="flag" size={18} color="#900" />},
          {label: 'Books', value: 'book', icon: () => <Icon name="flag" size={18} color="#900" />},
        ]}

        placeholder="Select category"
        multiple={true}
        multipleText="%d categories have been selected."
        min={0}
        max={10}
        
        defaultValue={this.state.items}
        containerStyle={{height: 40}}
        itemStyle={{
          justifyContent: 'flex-start'
        }}
        onChangeItem={item => this.setState({
          items: item // an array of the selected items
        })}
      />
    )
  }
}
export default Dropdown;

Answer 1

您必须使用“占位符”道具而不是标签。

 <DropDownPicker
        items={[
          {label: 'Sports', value: 'sports', icon: () => <Icon name="flag" size={18} color="#900" />},
          {label: 'Books', value: 'book', icon: () => <Icon name="flag" size={18} color="#900" />},
        ]}
        
        placeholder="Select category"
        multiple={true}
        multipleText="%d categories have been selected."
        min={0}
        max={10}
        defaultValue={'sports'}
        containerStyle={{height: 40}}
        itemStyle={{
          justifyContent: 'flex-start'
        }}
        onChangeItem={item => this.setState({
          items: item // an array of the selected items
        })}
      />

工作零食 https://snack.expo.io/@guruparan/646ecd

更改下拉菜单的标题 header

Change the title of the dropdown header

react-native

drop-down-menu

categories

picker