sohobloo / react-native-modal-dropdown

A react-native dropdown/picker/selector component for both Android & iOS.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

renderButtonText does not work

Mexxerio opened this issue · comments

The newly added renderButtonText property does not work. The function gets called after an option is selected, but it doesn't correctly set the button text. It still shows [object Object].

@Mexxerio Check your package.json. And change "react-native-modal-dropdown": "^0.5.0" to "^0.6.0".

@IvanIvaschenko It already is on ^0.6.0. I specifically updated it to use that new feature.

@Mexxerio find the module in node_modules. Open ModalDropdown and look on line 361 you should see this string buttonText: renderButtonText && renderButtonText(rowData) || rowData.toString(). If no try to restart packager.

@IvanIvaschenko It's there.

@Mexxerio share your code.

is this library work both ios and android , i am still getting [object object ]

I am also getting this issue as well. Here is a snippet of my code I continue to get [object object] and i double checked that im on version ^0.6.0.

selectChangeHandler = (index, facility) => {
  this.props.selectChangeHandler(facility);
};

const renderPrompt = (rowData) => {
  return rowData.name;
};

<ModalDropdown ref={el => this.dropdown = el}
                       options={this.props.options}
                       renderButtonText={renderPrompt}
                       renderRow={rowRender}
                       onSelect={this.selectChangeHandler}/>

Dug around a bit more if i remove the onSelect from ModalDropdown the renderButtonText works.

@atul-forbinary @mrkirchner You can use dirty hack.
const Languages = [
{ value: 'English', source: require('../../../assets/gb.png'), locale: 'en' },
{ value: 'Espanol', source: require('../../../assets/es.png'), locale: 'es' },
{
value: 'Francais',
source: require('../../../assets/fr.png'),
locale: 'fr'
},
{
value: 'Portuguese',
source: require('../../../assets/pt.png'),
locale: 'pt'
},
{ value: 'Deutsch', source: require('../../../assets/de.png'), locale: 'de' },
{ value: 'Italiano', source: require('../../../assets/it.png'), locale: 'it' }
]

<ModalDropdown
options={Languages.map(item => item.value)}
textStyle={[styles.text, styles.regularText]}
style={styles.dropdown}
onSelect={(indx, value) => this.onSelect(value, indx)}
dropdownTextStyle={[styles.text, styles.dropdownText]}
dropdownStyle={styles.dropdownStyle}
defaultValue={this.state.lang}
renderRow={this.renderRow.bind(this)}
/>

onSelect = async (value, indx) => {
let Lang = Languages[indx]
...
}

@IvanIvaschenko Not sure what your trying to show here. Anytime i try to setState or call a props.function in my selectHandler it will not work.

@sohobloo Any suggestions on whats going on or is it a bug? Doing a quick look at your js it seems like renderButtonText is only being used onPress does it also need to happen on select(idx) or componentWillReceiveProps?

Issue only occurs on a a onSelect Function which contains a setState in it. I assume its because setState is asynchronous but not sure of a way around that.

Opened an MR #131 not sure if that is best way to fix things. Still learning react ...

This issue has been fixed. Please update to v0.6.1

Sorry, my fault and thanks to @swb2016(#128)
and also thanks to @mrkirchner

I am also still finding this issue, I have version 0.6.1

commented

@sohobloo same here, 0.6.1 version and still hitting the [object] thing, why is this so tough to get working?