使共享組件與調用navigation.navigate（）裏面 - 反應原生

我想在共同組件的所有屏幕作出反應本機。所以我可以在主要組件之間分享它們。使共享組件與調用navigation.navigate（）裏面 - 反應原生

見下面我的代碼，一切正常但this.props.navigation.navigation.navigate('HireJob')沒有工作。

mycode的：

export default class MyComponent extends Component { 

    callAndPush =() =>{ 
     console.log('callAndPush'); 
     this.props.navigation.navigate('HireJob') 
    } 

    render() { 
     return (
       <TouchableHighlight style = {{backgroundColor : 'red' , height : 30}} onPress = {() => this.callAndPush()}> 
       <Text>Apple</Text> 
       </TouchableHighlight> 
     ); 
    } 
}

使用組件的：

render(){ 
    return (
     <View style = {styles.scrollSty}> 
      <MyComponent></MyComponent> 
    </View> 
    ); 
} 
}

來源

2017-08-08 Kirit Modi

你能詳細說明嗎？ – eden

@伊甸園想在所有視圖中添加一個共同點。這樣我就可以創建一個父母班來查看。 –

'Like component'？ – eden

它是這樣工作的，繞過navigation prop轉換爲MyComponent。

<MyComponent {...this.props} />

來源

2017-08-09 03:21:59 Val

每個組件可以被導入到其他組件，諸如導航儀。他們通過共享道具導入你的場景並在它們之間導航。

要使組件，並用它在不同的地方只需創建一個：

export default class MyComponent extends React.Component { 
    render() { 
     return (
       <Text> This is a special component </Text> 
     ); 
    } 
}

而在你的其他類使用這樣的：

import MyComponent from '../path/to/MyComponent'; 

class AnotherComponent extends React.Component { 
    render() { 
     return (
       <MyComponent /> 
     ); 
    } 
}

從陣營0.14開始，您可以創建這些使用stateless components簡單：

// A functional component using an ES2015 (ES6) arrow function: 
const MyComponent = (props) => { 
    return <Text> This is a special component </Text> 
};

你可以，如果你使用的道具數據傳遞喜歡。

來源

2017-08-08 10:47:54 eden

是的，我會在MyComponent中添加TouchableHighlight。並想推出另一個控制器它給錯誤。 undefine不是一個對象。 this2.props.navihation.navigate –

傳遞函數作爲道具。我會更新我的答案tonighy – eden

現在更新的代碼。在MyComponent中有一個函數callAndPush並且工作正常，但問題是使用堆棧導航進行推送。 –

使共享組件與調用navigation.navigate（）裏面 - 反應原生

回答

相關問題