Soy bastante nuevo en reaccionar nativo y no sé cómo encontrar una solución para lo que estoy tratando de lograr. Tengo varias funciones que devuelven un valor nulo o una cadena. Quiero mostrar el valor devuelto cuando no es nulo. por ejemplo mis funciones son
//these functions either return null or a string const a =() => { ...}; const b =() => { ...}; const c =() => { ...}; Tengo un componente <Text> y quiero mostrar los valores de retorno de las funciones dentro de mi componente <Text> .
Ahora mismo lo estoy haciendo de la siguiente manera
<Text> {a()}{b()}{c()} </Text>Ahora todo funciona bien y el texto solo mostrará el valor de retorno cuando sea una cadena.
Quiero agregar un operador condicional ternario y verificar si una nueva variable tmp no está definida o no. si tmp no está indefinido, <Text> debería mostrar el valor de tmp de lo contrario, debería mostrar el valor de retorno de la función que tengo arriba.
<Text> {tmp !== undefined ? tmp : }{a()}{b()}{c()} </Text>si hago algo como
<Text> {tmp !== undefined ? tmp : ( a(); b(); c(); )} </Text> y si tmp no está definido, también mostrará el nulo devuelto por la función. pero no quiero que el valor nulo devuelto por las funciones se muestre como en el primer ejemplo.
¿Podrían sus funciones a , b y c devolver una cadena vacía en lugar de null ?
Si es así, podría reescribir su respuesta como:
<Text>{tmp || `${a() + b() + c()}`}</Text>Si no, es un poco más engorroso de escribir, pero la misma idea funcionaría:
<Text>{tmp || `${a() || ''}${b() || ''}${c() || ''}`}</Text>Hay varias formas de lograr esto, en React Native puede tener componentes <Text> anidados. En lugar de usar un operador ternario, lo haría así:
<View> {tmp && ( <Text> {_a && <Text>{_a}</Text>} {_b && <Text>{_b}</Text>} {_c && <Text>{_c}</Text>} </Text> )} </View>Ver la merienda https://snack.expo.dev/@abranhe/undefinedvalues