I have this function when a button is clicked but for some reason it stops before the if statement.
Here is the javascript:
const nextStep = (e) => {
e.preventDefault();
console.log('click')
let value = e.target.value;
console.log(value);
props.setAge(value);
console.log('set props');
if(value === 'Yes' && navBarData.isMedicare !== true){
console.log('went into true')
//if yes -> continue to medicare routes -> Leave default navbar data
props.updateMedicareNavBarData();
console.log('updated medicare prop')
navigate('/enrolled')
console.log('nav')
} else if (value === 'No' && navBarData.isHealth !== true) {
//if no -> health care routes -> use health navvar data
console.log('went into no')
props.updateHealthNavBarData();
navigate('/coverage-time')
}
}
here is the button:
<div className=" leading-5 buttonBlock">
{buttons.map((button) => (
<button
className="chooseButton border border-blue-500 rounded text-blue-500 hover:bg-blue-500 hover:text-white hover:shadow-lg hover:shadow-blue-500/50 transition duration-200 font-bold"
key={button.key}
id={button.id}
value={button.value}
onClick={nextStep}
>
{button.title}
</button>
))}
</div>
and lastly here is my console log:
click - Age.jsx:20
Yes - Age.jsx:22
set props -
as you can i see i have console logs in the if statement but that doesnt happen, any idea why this is happending?
CodePudding user response:
Most probably, both the if
statement and else if
statement are false. Make an else
statement printing something to the console. If it does print, then both conditions above are false- if it doesn't print for some reason (which is unlikely), then there may be another issue. We can cross that bridge if we come to it, though.