代码之家  ›  专栏  ›  技术社区  ›  Anjali

获取顶部的重复导航选项

  •  1
  • Anjali  · 技术社区  · 7 年前

    enter image description here

    我只想要最上面的导航栏。我不想要第二个。我看了好几遍代码,但找不到错误。我不知道我做错了什么,我看到重复的导航栏。以下是我的代码:

    import React, { Component } from 'react';
    import { Text, View, StyleSheet, ListView, ActivityIndicator, TextInput, TouchableOpacity } from 'react-native';
    import { Provider, connect } from 'react-redux';
    import { createStore } from 'redux'
    import reducers from '../reducers/ServiceReducer';
    import ServiceItem from './ServiceItem';
    import Icon from 'react-native-vector-icons/EvilIcons';
    import ServiceDetail from './ServiceDetail';
    import { StackNavigator } from 'react-navigation';
    import ServiceListDetails from './ServiceListDetails' ;
    
    class AutoCompActivity extends Component {
    
      constructor(props) {
    
        super(props);
    
        this.state = {
    
          // Default Value of this State.
          Loading_Activity_Indicator: true,
          text:'',
          selected_topic_id: -1,
    
        }
        this.arrayholder=[];
      }
     componentDidMount() {
    
        const data = require('../reducers/services.json')
    
    
    
            let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
            this.setState({
              Loading_Activity_Indicator: false,
              dataSource: ds.cloneWithRows(data),
            }, function() {
    
              // In this block you can do something with new state.
              this.arrayholder = data ;
            });
    
    
      }
    
    
      SearchFilterFunction(text){
    
        const newData = this.arrayholder.filter(function(item){
            const itemData = item.ser.toUpperCase()
            const textData = text.toUpperCase()
            return itemData.indexOf(textData) > -1
        })
        this.setState({
            dataSource: this.state.dataSource.cloneWithRows(newData),
            text: text
        })
    }
    
    ListViewItemSeparator = () => {
      return (
        <View
          style={{
            height: .5,
            width: "100%",
            backgroundColor: "#000",
          }}
        />
      );
    }
    clickedItemText( clickedItem )
        {
            this.props.navigation.navigate('Item', { item: clickedItem ,  navigationOptions:{header:null}}   );
        }
    
    
      static navigationOptions =
        {
    
         title: 'testing'
    
        };
    
    render()
    {
      // this is my render code. I can put the render code if someone wants to see it.
    }
    
    
    export default MyNewProject=   StackNavigator(
    {
      First:   {screen: AutoCompActivity},
      Item: {screen: ServiceListDetails, navigationOptions:{header:null}},
    
    }
    

    任何帮助都将不胜感激。

    1 回复  |  直到 7 年前
        1
  •  0
  •   agm1984    7 年前

    嗯,很难说这是怎么回事。这里有:

    static navigationOptions =
    {
    
     title: 'testing'
    
    };
    

    static navigationOptions =
    {
    
     header: null,
    
    };
    

    StackNavigator() .

    export default MyNewProject = StackNavigator(
      {
        First:   {screen: AutoCompActivity},
        Item: {screen: ServiceListDetails},
      },
      {
        navigationOptions: {
          header: null,
        }
      }
    )
    

    或者你可以这样做:

    class AutoCompActivity extends Component {
      static navigationOptions = {
        header: null,
      }
    
      render() {
        // ...
      }
    }
    

    https://hackernoon.com/how-to-use-a-custom-header-and-custom-bottom-tab-bar-for-react-native-with-react-navigation-969a5d3cabb1

    根据我在这里看到的,试试 header: null 在StackNavigator的第二个参数对象中。我有种预感,如果没有那一堆的话,其中一个标题会消失。真让人困惑。有时我自己也讨厌,但一旦你找到了喜欢的模式,这对支持写作是有好处的。

    null 在你能搞定之前,他们都出来了。

    推荐文章