2017-09-08 7 views
0

に包まれなければならない、私はこのエラーを反応させ、取得する新たなんだ:RawText ";}" 明示的な<Text>

RawTextは ";}" 明示的な

に包まれなければなりませんJSON配列をマップしようとしました。これは何かをマップしようとするたびに起こっています。私はそれが宇宙のキャラクターと何か関係があることを読んだが、私は何も見つけられない。 これをどのようにデバッグすることができますか?乾杯!ここでは、コード

import React from 'react'; 
 
    import { AppRegistry, asset, Pano, Text, Image, View, StyleSheet,} from 'react-vr'; 
 
    
 
    export default class Kuji extends React.Component { 
 
     static defaultProps = { 
 
     prjSource: 'projects.json', 
 
     }; 
 
    
 
    constructor(props) 
 
    { 
 
     super(props); 
 
    
 
     this.state = { 
 
     data: null, 
 
     projectId: null, 
 
     rotation: null, 
 
     }; 
 
    } 
 
    
 
    componentDidMount() 
 
    { 
 
     fetch(asset(this.props.prjSource).uri) 
 
     .then(response => response.json()) 
 
     .then(responseData => { 
 
     this.init(responseData); 
 
     }) 
 
     .done(); 
 
    } 
 
    
 
    init(projectConfig) { 
 
     // Initialize the tour based on data file. 
 
     this.setState({ 
 
     data: projectConfig, 
 
     }); 
 
    } 
 
    
 
    
 
    render() { 
 
     if(!this.state.data) 
 
     { 
 
     return null; 
 
     } 
 
    
 
    const projectId = (this.state.projectId); 
 
    const projectData = (this.state.data.projects); 
 
    
 
     return (
 
     <View> 
 
      <Pano source={asset('dolphin.jpg')}/> 
 
      <View> 
 
      {projectData.map((project, index) => { 
 
       return (
 
       console.log(project.title) 
 
       ); 
 
       })}; 
 
      } 
 
      </View> 
 
     </View> 
 
    ) 
 
    }; 
 
    } 
 
    
 
    AppRegistry.registerComponent('Kuji',() => Kuji);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

+0

あなたのための答えの仕事をしていますか?はいの場合は、答えの近くにチェックマークを付けることで、承認済みとマークしてください。ありがとう。 –

答えて

2

がある私はあなたのprojects.mapコードが終了した後、あなたの文字列として扱い、それを反応する、描画に余分};を持っていると思います。それを削除して試してみると、コードは正常に動作するはずです。

import React from 'react'; 
 
import { AppRegistry, asset, Pano, Text, Image, View, StyleSheet,} from 'react-vr'; 
 

 
export default class Kuji extends React.Component { 
 
    static defaultProps = { 
 
    prjSource: 'projects.json', 
 
    }; 
 

 
constructor(props) 
 
{ 
 
    super(props); 
 

 
    this.state = { 
 
    data: null, 
 
    projectId: null, 
 
    rotation: null, 
 
    }; 
 
} 
 

 
componentDidMount() 
 
{ 
 
    fetch(asset(this.props.prjSource).uri) 
 
    .then(response => response.json()) 
 
    .then(responseData => { 
 
    this.init(responseData); 
 
    }) 
 
    .done(); 
 
} 
 

 
init(projectConfig) { 
 
    // Initialize the tour based on data file. 
 
    this.setState({ 
 
    data: projectConfig, 
 
    }); 
 
} 
 

 

 
render() { 
 
    if(!this.state.data) 
 
    { 
 
    return null; 
 
    } 
 

 
const projectId = (this.state.projectId); 
 
const projectData = (this.state.data.projects); 
 

 
    return (
 
    <View> 
 
     <Pano source={asset('dolphin.jpg')}/> 
 
     <View> 
 
     {projectData.map((project, index) => { 
 
      return (
 
      console.log(project.title) 
 
      ); 
 
      }) 
 
     } 
 
     </View> 
 
    </View> 
 
) 
 
}; 
 
} 
 

 
AppRegistry.registerComponent('Kuji',() => Kuji);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

関連する問題