【问题标题】:Set no header for all components React-Native为所有组件 React-Native 不设置标题
【发布时间】:2018-12-03 15:58:39
【问题描述】:

我有 4 个组件都定义了 static navigationOptions = {header: null}。 但是在每个组件中定义它非常耗时。 所以我在 createStackNavigator 中定义了{header: null},但标题仍然出现在组件的顶部。

你们能帮忙吗?

import { createStackNavigator } from 'react-navigation';
import Home from './Components/Home';
import Main from './Components/Main';
import SubjectDetail from './Components/AnimalSubject';
import Lesson from "./Components/Lesson";

const App = createStackNavigator({
     First: { screen: Home },
     Second: { screen: Main },
     Third: { screen: SubjectDetail },
     Four: {screen: Lesson},
//Route name with specified component
},
{
     transitionConfig: () => ({ screenInterpolator: () => null }),
//remove transition config
},
{
     initialRouteName: 'First',
//the component name 'Home' will be initiated first
},
{
     header: null
//defined header: nul
}
);

export default App;

我的环境

"react": "16.3.1",
"react-native": "~0.55.2",
"react-navigation": "^2.2.5",
"node": "v8.11.2"
"npm": "v6.1.0"

【问题讨论】:

  • 你可以试试这里提到的接受的答案stackoverflow.com/questions/44701245/…
  • @AravindS 没有任何变化,标题仍然出现在顶部:(
  • 你可以试试navigationOptions: { header: null } 在路由名称中作为道具...比如screen: Home, navigationOptions: { header: null }
  • 还是没有变化
  • 能否分享您更新的 app.js 文件。

标签: javascript reactjs react-native react-navigation


【解决方案1】:

也许这段代码应该适合你(基于Stack navigator docs

const App = createStackNavigator({
     First: { screen: Home },
     Second: { screen: Main },
     Third: { screen: SubjectDetail },
     Four: {screen: Lesson},
},
{
     headerMode: 'none',
     transitionConfig: () => ({ screenInterpolator: () => null }),
     initialRouteName: 'First',
},
);

你应该传递带有路由的对象作为第一个参数,公共选项作为第二个参数。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-12-01
    • 1970-01-01
    • 2020-11-23
    • 2016-10-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多