這個邊欄組件有什麼問題？它顯示原始文本「}」必須用明確的文本組件包裝

-1

此代碼在最後一天工作。當我們嘗試分離它時顯示此錯誤。我確信這個組件中的麻煩就在於其他組件完美地工作。可能是什麼原因呢？您可以檢查下面的代碼：

import React from "react"; 
import { 
    View, 
    Text, 
    StyleSheet, 
    Dimensions, 
    Platform, 
} from "react-native"; 
import { 
    Content, 
    List, 
    Icon, 
    ListItem, 
    Left, 
    Input, 
    Item, 
    Thumbnail 
} from "native-base"; 
import Exponent from "expo" 
const screenHeight = Dimensions.get("window").height; 
const datas = [ 
    { 
    name: "Home", 
    route: "Home", 
    icon: "home", 
    }, 

    { 
    name: "Business", 
    route: "Home", 
    icon: "briefcase", 
    }, 
    { 
    name: "Education", 
    route: "Home", 
    icon: "book", 
    }, 
    { 
    name: "Life Style", 
    route: "Home", 
    icon: "shirt", 
    }, 
    { 
    name: "Tech", 
    route: "Home", 
    icon: "phone-portrait", 
    }, 
    { 
    name: "Profile", 
    route: "Profile", 
    icon: "contact", 
    }, 
    { 
    name: "Settings", 
    route: "Settings", 
    icon: "settings", 
    }, 
    { 
    name: "Contact", 
    route: "Contact", 
    icon: "mail", 
    }, 
    { 
    name: "Log Out", 
    route: "Signin", 
    icon: "log-out", 
    }, 
]; 

const DrawerContent = props => { 

    return (
    <View style={styles.container}> 
     <Content style={{marginTop: 20}}> 
     <View style={styles.avatarview}> 
     <Thumbnail source={require("../img/profile4.jpg")} style={{marginTop:40}}/> 
     <Text style={styles.profiletext}> Jhon </Text> 
     </View> 
     <List 
      dataArray={datas} 
      renderRow={data => 
      <ListItem 
       button 
       noBorder 
       onPress={() => props.navigation.navigate(data.route)} 
      > 
       <Left style={{marginLeft: 15}}> 
       <Icon 
        active 
        name={data.icon} 
        style={styles.navicon} 

       /> 
       <Text style={styles.navtext}> 
        {data.name} 
       </Text> 
        } 
       </Left> 
      </ListItem>} 
     /> 
     </Content> 
    </View> 
); 
}; 

const styles = { 
    container: { 
    height: screenHeight, 
    backgroundColor: "#ffffff", 
    flex: 1, 
    paddingTop: Exponent.Constants.statusBarHeight, 
    }, 
    avatarview: { 
    height:200, 
    backgroundColor:"#ffffff", 
    alignItems:"center" 
    }, 
    profiletext:{ 
    marginTop:30, 
    color:"#ffffff" 
    }, 

navicon:{ 
    color: "#222222", 
    fontSize: 22, 
    marginTop: Platform.OS === "ios" ? 1.8 : 4, 
}, 
navtext:{ 
    color: "#222222", 
    fontSize: 22, 
    marginLeft: 15 
}, 


}; 

export default DrawerContent;

我們正在使用本地基地和世博會。最有趣的是eslint沒有顯示任何可能導致它的行。什麼是錯的，如何解決這個問題？

來源

2017-11-11 NewTech Lover

在'DrawerContent'中''後面有一個額外的'}' – bennygenel

由於在和之間有一些額外的空間，因此出現此錯誤。你需要檢查這個錯誤實際增加的空間。 –

   </Text> 
       } 
      </Left>

您需要移除該支架。

來源

2017-11-11 09:56:42

非常感謝它的工作。 –

這個邊欄組件有什麼問題？它顯示原始文本「}」必須用明確的文本組件包裝

回答

相關問題