3

コンポーネント内のボタンをオーバーライドできましたが、ローカル機能を呼び出すことができませんでした。たとえば、「リフレッシュ」を押すと、これは、ボタンテキストを上書きして機能を実行する正しい方法ですか?あなたの助けがありがたいです。ありがとう。ネイティブルータフラックスに反応:コンポーネント内の左または右ボタンをオーバーライドしてローカル機能にアクセス

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

import styles from '../src/styles/home' 

var WEBVIEW_REF = 'webview'; 
class WebViewComponent extends Component { 

    static rightTitle = "Refresh"; 
    static onRight() { 
    this.reload; 
    } 

    static propTypes = { 
    url: PropTypes.string, 
    scalesPageToFit: PropTypes.bool, 
    startInLoadingState: PropTypes.bool, 
    }; 

    static defaultProps = { 
    url: 'http://google.com', 
    scalesPageToFit: true, 
    startInLoadingState: true, 
    }; 

    render() { 
    return (
     <WebView 
      ref={ WEBVIEW_REF } 
      style={ { flex: 1, marginTop: 50 } } 
      source={ { uri: this.props.url } } 
      scalesPageToFit={ this.props.scalesPageToFit } 
      startInLoadingState={ this.props.startInLoadingState } /> 
    ); 
    } 

    reload =() => { 
    alert('reload'); 
    }; 

} 

module.exports = WebViewComponent; 
+0

あなたは ')(' this.reloadを試してみましたか? –

+0

@SagarKhatriはい。私はこれらの3、this.reload()、reload()およびthis.reloadを試しました。しかし、残念なことにそれらのどれも動作しません。 – Newbie009

+0

静的キーワードを 'onRight'メソッドから削除します。 –

答えて

2

私はcomponentDidMountを(使用、静的を使用していけない、いくつかの研究の後に答えを得る)

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

import styles from '../src/styles/home' 

var WEBVIEW_REF = 'webview'; 
class WebViewComponent extends Component { 

    //here is the answer 
    componentDidMount() { 
    Actions.refresh({rightTitle: 'Refresh', onRight: this.reload}) 
    } 

    static propTypes = { 
    url: PropTypes.string, 
    scalesPageToFit: PropTypes.bool, 
    startInLoadingState: PropTypes.bool, 
    }; 

    static defaultProps = { 
    url: 'http://google.com', 
    scalesPageToFit: true, 
    startInLoadingState: true, 
    }; 

    render() { 
    return (
     <WebView 
      ref={ WEBVIEW_REF } 
      style={ { flex: 1, marginTop: 50 } } 
      source={ { uri: this.props.url } } 
      scalesPageToFit={ this.props.scalesPageToFit } 
      startInLoadingState={ this.props.startInLoadingState } /> 
    ); 
    } 

    reload =() => { 
    alert('reload'); 
    }; 

} 

module.exports = WebViewComponent; 
関連する問題