状態変化にネイティブWebViewのリロードを返す

Question

9行目のエラー WebViewの状態（url）を変更する必要があります。 これは私の最初の機能のエラーです... 助けていただければ幸いです。 enter image description here

私はタッチのURLの状態を変更するTouchableOpacityを必要とし、この

にかなり新しいです。

import React, { Component } from 'react'; 
import {View, WebView, Dimensions, AppRegistry, StatusBar, Text, TouchableOpacity} from 'react-native'; 

let ScreenHeight = Dimensions.get("window").height; 
let ScreenWidth = Dimensions.get("window").width; 

export default class dynamix extends Component { 

    function setState(obj){ 
    this.state.url = obj.url; 
    } 

    function onPressButtonURL1(){ 
    this.setState({ url: 'url1'}) 
    } 
    function onPressButtonURL2(){ 
    this.setState({ url: 'url2'}) 
    } 
    function onPressButtonURL3(){ 
    this.setState({ url: 'url3'}) 
    } 

    render() { 
    return (
     <View> 
     <View style={{height:ScreenHeight-100, width:ScreenWidth}}> 
     <WebView style={{ 
      paddingTop:25, 
      backgroundColor: '#f8f8f8', 
      width:ScreenWidth, 
      height:ScreenHeight, 
     }} 
     source={{ url: this.state.url }} 
     /> 
     <StatusBar hidden /> 
     </View> 
       <View style={{ 
       backgroundColor:'#131313', 
       height:100, 
       width:ScreenWidth 
       }}> 
       <View style={{ 
       width:ScreenWidth 
       }}> 
        <TouchableOpacity onPress={() => onPressButtonURL1()}><Text style={{color:'#fff', padding:10,fontSize:15}}>"text1"</Text></TouchableOpacity> 
        <TouchableOpacity onPress={() => onPressButtonURL2()}><Text style={{color:'#fff', padding:10,fontSize:15}}>"text2"</Text></TouchableOpacity> 
        <TouchableOpacity onPress={() => onPressButtonURL3()}><Text style={{color:'#fff', padding:10,fontSize:15}}>"text3"</Text></TouchableOpacity> 
       </View> 
       </View> 
     </View> 
    ); 
    } 
} 

AppRegistry.registerComponent('dynamix',() => dynamix); 

Answer 1

import React, { Component } from 'react'; 
import { Text, View, WebView, TouchableOpacity, Dimensions } from 'react-native'; 

const { 
    height: ScreenHeight, 
    width: ScreenWidth 
} = Dimensions.get('window'); 

export default class dynamix extends Component { 
    constructor() { 
    super(); 
    this.state = { 
     url: 'https://www.google.co.uk' 
    } 
    } 
    onPressButtonURL = (url) => { 
    this.setState({ url }) 
    } 
    render() { 
    return (
     <View> 
     <View style={{height:ScreenHeight-100, width:ScreenWidth}}> 
     <Text>{this.state.url}</Text> 
     <WebView style={{ 
      paddingTop:25, 
      backgroundColor: '#f8f8f8', 
      width:ScreenWidth, 
      height:ScreenHeight, 
     }} 
     source={{ uri: this.state.url }} 
     /> 
     </View> 
       <View style={{ 
       backgroundColor:'#131313', 
       height:100, 
       width:ScreenWidth 
       }}> 
       <View style={{ 
       width:ScreenWidth 
       }}> 
        <TouchableOpacity onPress={() => this.onPressButtonURL('https://stackoverflow.com')}><Text style={{color:'#fff', padding:10,fontSize:15}}>text1</Text></TouchableOpacity> 
        <TouchableOpacity onPress={() => this.onPressButtonURL('https://www.google.com')}><Text style={{color:'#fff', padding:10,fontSize:15}}>text2</Text></TouchableOpacity> 
        <TouchableOpacity onPress={() => this.onPressButtonURL('https://bbc.co.uk')}><Text style={{color:'#fff', padding:10,fontSize:15}}>text3</Text></TouchableOpacity> 
       </View> 
       </View> 
     </View> 
    ); 
    } 
} 

AppRegistry.registerComponent('dynamix',() => dynamix); 

編集：私はちょうどキーワードfunctionはあなたにエラーを投げている、あなたの添付画像を見てきました。あなたがhereに行くと

class Person { 
    function setName(name) { 
    this.name = name; 
    } 
} 

に貼り付けると

あなたはUnexpected token (2:11)エラーが表示されます。 functionキーワードを削除すると機能します。