Question

我是React的新手。我正在使用DrawerNavigator创建自定义抽屉导航。我想从API获取类别列表，并使用参数cat_id添加菜单列表。每个类别将转到同一页面/屏幕，但参数将用于获取结果列表。

我尝试为DrawerNavigator创建数组，但由于组件不足而无法获取它。


export default class App extends Component {
  componentDidMount() { 
    global.dState=0;
    global.dynamicData = ["Cats", "Dogs", "Lions"]
    return fetch('http://xxxx.com/Api.php?action=category')
      .then((response) => response.json())
      .then((responseJson) => { 
        this.dataSource = responseJson
      })
  }

  render() {
    return (
      <MyApp authed={this.state.ddata} />
    )
  }
}

const CustomDrawerContentComponent = (props) => (

  <Container>
    <Header style={styles.drawerHeader}>
      <Body>
        <Image
          style={styles.drawerImage}
          source={require('./assets/DrawerIcons/Logo.png')} />
      </Body>
    </Header>
    <Content>
      <DrawerItems {...props} />
    </Content>

  </Container>

);

const MyApp = DrawerNavigator({
//// Below list will come from API
  Home: {
    screen: HomeScreen,
    navigationOptions: ({ navigation }) => ({
      title: 'Home'
  })
  },
  Settings: {
    screen: SettingsScreen,
    navigationOptions: ({ navigation }) => ({
      drawerLabel: () => null
  })
  }
},
  {
    initialRouteName: 'Home',
    drawerPosition: 'left',
    contentComponent: CustomDrawerContentComponent,
    drawerOpenRoute: 'DrawerOpen',
    drawerCloseRoute: 'DrawerClose',
    drawerToggleRoute: 'DrawerToggle'
  });

  Home: {
    screen: HomeScreen,
    navigationOptions: ({ navigation }) => ({
      title: 'Home'
  })
  },
  Settings: {
    screen: SettingsScreen,
    navigationOptions: ({ navigation }) => ({
      drawerLabel: () => null
  })
  }

Answer 1

不确定要了解您的问题，但这也许可以帮助您：setParams

触发setParams操作可使屏幕更改路线中的参数，这对于更新标题按钮和标题很有用。 setParams的工作方式类似于React的setState-将提供的params对象与当前params合并。

摘自文档https://reactnavigation.org/docs/en/navigation-prop.html#setparams-make-changes-to-route-params

Answer 2

我知道了。我已经将抽屉容器移动到组件中，然后使用push作为菜单对象。

if ((context as ContextThemeWrapper).baseContext is AppCompatActivity) {
            //View is attached to an AppCompatActivity
        } else {
            //View is not attached to an AppCompatActivity
        }
}

如何将菜单列表从API传递到Custom DrawerNavigator？

2 个答案: