0
137
Views¿Cómo elimino lo indefinido?
Si el usuario no tiene nombre, segundo nombre o apellido, se mostrará como indefinido. ¿Cómo puedo eliminar el subrayado, pero en su lugar pondré un dicho que necesitan hacer clic en este enlace para actualizar su perfil? 
import { useSelector } from "react-redux"; const mapState = ({ user }) => ({ currentUser: user.currentUser, }); const Settings = () => { const { currentUser } = useSelector(mapState); const name = currentUser?.firstName + " " + currentUser?.middleName + " " + currentUser?.lastName; return ( <> <Typography>Hello, {name}</Typography> </> ); }; export default Settings;
·
Juan Pablo Isaza
3 answers
Answer question0
import { useSelector } from "react-redux"; const mapState = ({ user }) => ({ currentUser: user.currentUser, }); const Settings = () => { const { currentUser } = useSelector(mapState); const nameComponents = [ currentUser?.firstName, currentUser?.middleName, currentUser?.lastName ].filter(part => Boolean(part)); const name = nameComponents.join(" ") return ( <> <Typography>Hello, {name}</Typography> { nameComponents.length !== 3 && <button @click="..."> Fill lackink parts of your name </button>} </> ); }; export default Settings;
·
Juan Pablo Isaza
Report
0
Puede hacer una verificación simple mientras renderiza el componente Typography como se muestra a continuación
return ( <> {( currentUser?.firstName && currentUser?.middleName && currentUser?.lastName ) ? <Typography>Hello, {name}</Typography> : <div>whatever </div> </> );
·
Juan Pablo Isaza
Report
0
Mapear y/filtrar los valores
Suponiendo que el usuario actual SOLO tiene nombre, apellido y segundo nombre
Necesitamos más pruebas si hay roles o direcciones, etc.
const currentUser = { "firstName" : "John", "lastName": "Doe" } const names = Object.values(currentUser).map(name => name || ""); console.log(names.join(" ")) console.log("Fullname?",names.filter(name => name).length >= 2) // destructing is not useful here // const { firstName, middleName, lastName} = currentUser // console.log(firstName, middleName, lastName)
·
Juan Pablo Isaza
Report
Answer question