我對 react-native 很陌生，我不知道如何為我想要實作的目標找到解決方案。我有多個回傳 null 或字串的函式。我想在它不為空時顯示回傳值。例如我的功能是
//these functions either return null or a string
const a =() => { ...};
const b =() => { ...};
const c =() => { ...};
我有一個<Text>組件，我想顯示<Text>組件內函式的回傳值。
現在我正在按照以下方式進行操作
<Text>
{a()}{b()}{c()}
</Text>
現在一切正常，文本僅在為字串時顯示回傳值。
我想添加一個三元條件運算子并檢查新變數tmp是否未定義。如果tmp不是未定義的，則<Text>應該顯示tmp值，否則它應該顯示我上面的函式的回傳值。
<Text>
{tmp !== undefined ? tmp : }{a()}{b()}{c()}
</Text>
如果我做類似的事情
<Text>
{tmp !== undefined ? tmp : (
a();
b();
c();
)}
</Text>
如果tmp未定義，它也會顯示從函式回傳的空值。但我不希望函式回傳的 null 像第一個示例那樣顯示。
uj5u.com熱心網友回復：
您的a,b和c函式可以回傳空字串而不是null嗎？
如果是這樣，您可以將答案重寫為：
<Text>{tmp || `${a() b() c()}`}</Text>
如果沒有，寫起來會有點麻煩，但同樣的想法也可以：
<Text>{tmp || `${a() || ''}${b() || ''}${c() || ''}`}</Text>
uj5u.com熱心網友回復：
有多種方法可以實作這一點，在 React Native 中，您可以使用嵌套<Text>組件。使用三元運算子，我會這樣做：
const a = () => null;
const b = () => '';
const c = () => 'something';
export default function App() {
const tmp = true;
const _a = a();
const _b = b();
const _c = c();
return (
<View>
{tmp && (
<Text>
{_a && <Text>{_a}</Text>}
{_b && <Text>{_b}</Text>}
{_c && <Text>{_c}</Text>}
</Text>
)}
</View>
);
}
看點心https://snack.expo.dev/@abranhe/undefinedvalues
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/437429.html
標籤：javascript 反应 反应式
下一篇：如何獲得下一個值（之后，值）