Реактивная навигация: диспетчеризация действий, но не навигация - PullRequest
Новая
       18

Реактивная навигация: диспетчеризация действий, но не навигация

0 голосов
/ 06 марта 2020

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

Любые идеи, как я могу решить эту проблему?

Новый компонент: 

import React, {Component} from 'react';
import {
  .....
} from 'react-native';
import {useDispatch} from 'react-redux';
import {StackActions, NavigationActions} from 'react-navigation';
import CustomImage from './CustomImage';

const VideoEpisode = props => {
  const {id, title, description, video, preview, push, testLink} = props;

  const dispatch = useDispatch();
  return (
    <TouchableHighlight
      ....
      onPress={() => {
        const resetAction = StackActions.reset({
          index: 0,
          actions: [
            NavigationActions.navigate({
              routeName: testLink ? 'TestYourself' : 'VideoPlayer',
              params: {id},
            }),
          ],
        });
        dispatch(resetAction);
      }}>
      ...
    </TouchableHighlight>
  );
};

export default VideoEpisode;

Старый компонент, используя dispatch из реквизита: 

export default class VideoEpisode extends React.Component {
  constructor(props) {
    super(props);
    this.state = { height: 215 };
  }

  render() {
    const {
      id,
      title,
      description,
      video,
      preview,
      push,
      dispatch,
      testLink
    } = this.props;

    return (
      <TouchableHighlight
        style={styles.episode}
        activeOpacity={1}
        underlayColor="#808080"
        onPress={() => {
          const resetAction = StackActions.reset({
            index: 0,
            actions: [
              NavigationActions.navigate({
                routeName: testLink ? "TestYourself" : "VideoPlayer",
                params: { id }
              })
            ]
          });

          const navigateAction = NavigationActions.navigate({
            routeName: "About"
          });
          dispatch(resetAction);
        }}
      >
        <View style={styles.title}>
          <Text style={styles.text}>{title}</Text>
        </View>
      </TouchableHighlight>
    );
  }
}
...