получить дубликаты вариантов навигации вверху

Question

Я показываю список услуг на моей странице.Я использую реагирующую навигацию.Почему-то я вижу две навигационные панели в верхней части моего телефона.Ниже приведено изображение:

Я просто хочу самую верхнюю панель навигации.Я не хочу второй.Я просмотрел свой код несколько раз, но не смог найти ошибку.Я не уверен, что я делаю неправильно, что я вижу дублирующую панель навигации.Ниже мой код:

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}},

}

любая помощь будет принята с благодарностью.

Answer 1

Хм, сложно сказать, что здесь происходит.Где у вас это есть:

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 во втором параметре Object of StackNavigator.Я чувствую, что один из заголовков уйдет, но для всего этого стека.Это действительно сбивает с толку.Я иногда ненавижу это сам, но это хорошо для поддержки композиции, когда вы найдете шаблон, который вам нравится.

Моя формулировка здесь может сбить с толку.Я говорю null их всех, пока вы не сможете справиться с этим.