quiero crear una función o una declaración condicional, puede decir que puede mostrar diferentes componentes en función de "Si el usuario ha comprado productos", luego muestre los componentes de los productos; de lo contrario, muestre "solo un texto simple como navegar o comprar productos".
<div> <Bookscard /> </div>así que este es mi componente, dentro del componente se están mapeando los productos comprados. ¿Puedo obtener una declaración condicional que pueda mostrar este componente como (si user.courses es mayor o igual a 1, entonces muestre el componente; de lo contrario, muestre un texto) algo como esto
Puedes probar esto:
<div> { user.courses.length > 0 && <Bookscard /> } { user.courses.length > 0 || <NoResults /> } </div>O puede mantener la coherencia con && al:
<div> { user.courses.length > 0 && <Bookscard /> } { user.courses.length == 0 && <NoResults /> } </div>Sumando a la respuesta de @ Antoine Baqain, también podría usar el operador ternario, así:
<div> { user?.courses?.length > 0 ? <Bookscard /> : <NoResults /> } </div>