react-native - 在 native react 中终止 map 循环

Question

一旦找到我要查找的内容(在本例中为引用)，我将尝试跳出循环。

我通过使用像 Java 这样的东西知道它实际上是可能的，但是事实证明它比我在 RN 中想象的要难。当我使用 JS break 时，它只是说它是一个语法错误，RN 中是否有任何 break 语句？

quotes.quotesArray.map((quote, i) => {
    if(!quote.isRead){
        return <Text key={i} style={styles.container, styles.quote}>{quotes.quotesArray[i].quotation}</Text>;                    
        break;
    } else {
       return 
    }
})

Answer 1

没有办法过早地打破Array.prototype.map .看起来您想呈现与 !quote.isRead 谓词匹配的第一个元素。如果是这种情况，您可以使用 Array.prototype.find找到第一个未读的引用，如果存在则呈现它。

var unreadQuote = quotes.quotesArray.find(quote => !quote.isRead)
render() {
  return (
    unreadQuote && 
    <Text style={styles.container, styles.quote}>{unreadQuote.quotation}</Text>;
  )
}