Encounters a runtime error while using renderRow

[afshin-hoseini]

The below snippet faces runtime error, while, it works just fine without renderRow prop.

<Dropdown 
                disabled = {this.state.isLoadingAgents}
                options = {["a","b"]}
                dropdownStyle = {[Styles.agentsDropDown]}
                adjustFrame = {style => {

                    style.width = this.agentDropdownFrameWidth
                    return style
                }}
                renderRow = {this.renderAgentRow.bind(this)}
                >

                <View style={Styles.agentSelectionBox} 
                 onLayout={(event) => this.agentDropdownFrameWidth = event.nativeEvent.layout.width}>

                    {this.state.isLoadingAgents ?
                    
                        <ActivityIndicator color = '#12125A'/> :
                        <Image style={Styles.compassImage}  source = {require('res/Images/Compass/compass.png')}/>
                    }
                    
                    <Text style = {Styles.selectAgentBox_title} > {I18n.t('SelectCity_variantSelection')} </Text>

                </View>

            </Dropdown>

The renderer method

renderAgentRow(item, index, selected) {

    return(<TouchableOpacity> <Text>{item}</Text> </TouchableOpacity>);
}

Error

Raw text cannot be used outside of a <Text> tag. Not rendering string: ' '

[sohobloo]

Please remove the spaces within the jsx return

return(<TouchableOpacity><Text>{item}</Text></TouchableOpacity>);