Nov 26, 2020
0
Level 8
React Native: selectedDays.includes is not a function
Hi everybody, I'm new to react-native and I have an input where I can choose multiple days of a week, if I click on a day which is alreadyAdded the day is removed from selectedDays array, however when I click on a day I get the following error:
TypeError: selectedDays.includes is not a function. (In selectedDays.includes(index+1) selectedDays.includes is undefined
My code:
const [ dayOptions, setDayOptions ] = useState([ 'Lunes','Martes','Miercoles','Jueves','Viernes','Sabado','Domingo']);
const [ selectedDays, setSelectedDays ] = useState([1]);
const clickedDay = (id)=>
{
const index = selectedDays.indexOf(id);
if (index > -1)
{
setSelectedDays(selectedDays.splice(index, 1));
}
else
{
setSelectedDays(selectedDays.push(id));
}
}
<View style={{ width:'100%',height:45,flexDirection:'row',alignItems:'center',flexWrap:'nowrap', justifyContent:'space-between' }}>
{dayOptions.map((option,index) => {return (
<TouchableOpacity key={option.title} onPress = {() => {clickedDayOptions(index+1) }} style={{ width:'13.2%', height:'100%', flexDirection:'row', alignItems:'center',justifyContent:'center', borderRadius:5,borderWidth:1, borderColor:'rgba(0,0,0,0.2)', ...selectedDays.includes(index+1) ? { backgroundColor: 'rgb(255,52,89)' } : { backgroundColor:'white' }, }}>
<Text style={{ fontWeight:'bold',fontSize:14, ...selectedDays.includes(index+1) ? { color: 'white' } : { color:'rgb(68,68,68)' }, }}>{ option }</Text>
</TouchableOpacity>)
})}
</View>
I tried changing includes for indexOf() > 1 and I get the same error, I usually get this when it's not an array but I defined selectedDays as an array in hooks...
Please or to participate in this conversation.