Shoutem v5 如何处理多级导航？

Question

示例未显示如何 link 从一个屏幕到另一个屏幕。这可以使用 Shoutem v5 网络界面吗？

Answer 1

在 Shoutem 的 navigateTo Redux 动作创建者文档中查看 here。使用该功能很容易导航到另一个屏幕。您只需调用它并向其传递屏幕 name 和屏幕道具。如果您想从当前扩展中打开屏幕，请使用 app/extension.js 文件中的 ext 函数。

这是屏幕文件：

import React, {
  Component
} from 'react';

import {
  TouchableOpacity,
  Text
} from 'react-native';

import { navigateTo } from '@shoutem/core/navigation';
import { ext } from '../extension';
import { connect } from 'react-redux';

class Screen extends Component {
  // method inside Screen component
  render() {
    const { navigateTo } = this.props;

    return (
      <TouchableOpacity onPress={() => navigateTo({
        screen: ext('AnotherScreen'),
        props: { }
      })}>
        <Text>Click here!</Text>
      </TouchableOpacity>
    );
  }
}

// connect screen to redux store
export default connect(
  undefined,
  { navigateTo }
)(Screen)

这样，您也可以连接 2 个不同的分机。由于扩展代表独立的功能，所有屏幕都已在内部链接。这就是为什么您不能在构建器内部手动执行此操作，但在代码中执行此操作与上面的代码一样简单。

Shoutem v5 如何处理多级导航？

How does Shoutem v5 handle multilevel navigation?

shoutem