Question

请这段代码有什么问题我删除了所有空格。我已经在代码中检查了半冒号。我仍然有相同的错误。

我之前读过它可能会因为空白而发生，但是我在下面的代码中看不到任何空白。我已经编辑了问题。

import React, { Component } from 'react';
import { StyleSheet, ScrollView, View } from 'react-native';
import { List, ListItem, Text, Card } from 'react-native-elements';

class DetailsScreen extends Component {
  static navigationOptions = {
    title: 'Details',
  };
  render() {
  const { navigation } = this.props;
  const matches = JSON.parse(navigation.getParam('matches', 'No matches found'));
  console.log(matches)

  return (
    <ScrollView>
      <Card style={styles.container}>
        {
          matches.map((item, key) => (
            <View key={key} style={styles.subContainer}>
            <View>
            <Text style={styles.baseText}>{item.group}</Text>
            </View>
            <View>
            <Text style={styles.baseText}>{item.team1.name}</Text>

             <Text>{item.team2.name}</Text>
            </View>
            <View>
            <Text style={styles.baseText}>{item.date}</Text>
            </View>
            <View>
            <Text style={styles.baseText}>{item.score1}</Text>

            <Text>{item.score2}</Text>
            </View>
              if(item.goals1.length > 0) {
                item.goals1.map((item2, key2) => (
                  <View key={key2}><Text style={styles.baseText}>{item2.name} {item2.minute}</Text></View>
                ))
              }
              if(item.goals2.length > 0) {
                item.goals2.map((item3, key3) => (
                  <View key={key3}><Text style={styles.baseText}>{item3.name} {item3.minute}</Text></View>
                ))
              }</View>
          ))
        }
      </Card>
    </ScrollView>
  );
}
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20
  },
  subContainer: {
    flex: 1,
    paddingBottom: 20,
    borderBottomWidth: 2,
    borderBottomColor: '#CCCCCC'
  },
  baseText:{
    fontFamily:'Cochin',
  fontSize:14,
  fontWeight:'bold'}
})
export default DetailsScreen;

Answer 1

从Text组件中删除h2，h3，h3，因为它没有道具（不是致命的，但没有用），并且您在这里也不需要()（{item2.minute}），这实际上破坏了代码

我建议还检查一下文本组件在这里有哪些道具和方法：

https://facebook.github.io/react-native/docs/text.html

希望这会有所帮助

Answer 2

同意wijuwiju的回答，也不要在<Text>组件中嵌套其他元素，包括<Text>。即使现在在一个平台上您看不到任何问题，它也将主要产生问题。

文本字符串必须在<text>组件中呈现

2 个答案: