Question

当我在redux中使用react-navigation时，我不想分离组件。如何制作“ const =“而不是创建新文件并“默认导出”

const IntroScreen2 =connect(mapStateToProps,mapDispatchToProps)(IntroScreen2a)
const IntroScreen2 =()=> connect(mapStateToProps,mapDispatchToProps)(IntroScreen2a)

导出默认连接... 哪个是对的？

https://codeshare.io/G79NRk

Answer 1

执行类似的操作，在与使用默认连接导出的位置相同的文件中定义组件，并传入文件中定义的组件。

这些陈述应有助于消除您的误会。

使用反应导航时，您将拥有屏幕（组件）和导航器。导航器是通过屏幕（组件）创建的。

您可以使用react-redux的connect函数将组件连接到redux存储。您只需在调用连接中包装一个组件，然后导出该组件的返回值，而不是导出组件本身。

创建导航器时，将需要为屏幕导入组件。

参见以下三页，我们制作一个组件，通过react-redux的connect函数导出连接到redux存储的组件。

然后，我们制造一个路由器，该路由器从反应导航中导出单个堆栈导航器，该导航器定义了单个屏幕，即已定义的组件（如上所述）。

然后，我举例说明了如何在App.js中渲染该路由器。

some-component.js

import React, {Component} from "react";
import {connect} from "react-redux"

// Define the component
class SomeComponent extends Component {
    render() {
        return null;
    }
}

// Map dispatch to props
const mapDispatchToProps = (dispatch) => {
   return {};
}

// Map state to props
const mapStateToProps = (state) => {
    return {};
};

// Export the component, passed into the connect function from react-redux.
export default connect (mapStateToProps, {}) (SomeComponent);

然后仅在使用反应导航定义导航器时导入此文件。

例如

router.js

import SomeComponent from "./some-component.js";
import {createStackNavigator} from "react-navigation";

export default createStackNavigator({
     PageOne: {
          screen: SomeComponent
     }
});

在您的App.js（根级别）中

import React, {Component} from "react";
import Router from "./router.js";

export default class App extends Component {

    render () {

        return <Router/>;
    }
}

类似的东西应该可以让您排序！

反应本机Redux导出默认连接

1 个答案: