React native 使用react native redux toast时未定义ToastationScreators

使用react native redux toast时，我无法调用ToastationScreators

调用this.props.dispatch（toastationscreators.displayInfo（“Info toast！”，2000））时，我收到一个toastationscreators未定义错误；在我的屏幕组件中。有人知道如何解决这个问题吗

在我的react原生调试器中，我能够看到react原生redux toast传入的toast reducer。但是，我在调用操作时遇到问题

多谢各位

这是我的代码示例

在Redux屏幕中

class ReduxScreen extends Component {
  _displayInfoToast = () => {
    this.props.dispatch(ToastActionsCreators.displayInfo("Info toast!", 2000));
  };

  render() {
    console.log(this.props);
    const { counter } = this.props.test;
    const { textStyle } = styles;

    return (
      <View>
        <Text style={textStyle}>{counter.toString()} </Text>
        <Button title="INCREMENT" onPress={this.props.incrementCounter} />
        <Button title="DECREMENT" onPress={this.props.decrementCounter} />
        <Button title="SHOW TOAST" onPress={this._displayInfoToast} />
      </View>
    );
  }
}

const mapStateToProps = state => {
  // console.log(state);
  return {
    test: state.test
  };
};

const mapDispatchToProps = dispatch => {
  return bindActionCreators(
    {
      incrementCounter,
      decrementCounter
    },
    dispatch
  );
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(ReduxScreen);

我没有向操作文件中添加任何与react native redux toast相关的代码，因为它的节点需要

我正在使用react navigation createDrawerNavigator进行导航

App.js

import { combineReducers } from "redux";
import testReducer from "./testReducer";
import { toastReducer as toast } from "react-native-redux-toast";

export default combineReducers({
  // test: () => []
  test: testReducer,
  toast
});

class App extends Component {
  constructor(props) {
    super(props);
    console.ignoredYellowBox = ["Setting a timer"];
  }
  render() {
    return (
      <ApolloProvider client={client}>
        <Provider store={store}>
          <MyProvider>
            <Drawer />
            <Toast messageStyle={{ color: "white" }} />
          </MyProvider>
        </Provider>
      </ApolloProvider>
    );
  }
}

类应用程序扩展组件{
建造师（道具）{
超级（道具）；
console.ignoredYellowBox=[“设置计时器”]；
}
render（）{
返回(
您没有在
ReduxScreen.js
中导入ToastationCreators。这就是它未定义的原因；您没有在该文件中的任何地方定义它。
我终于成功了！通过执行以下操作，它在我的props中添加了dispatch函数，允许我调用this.props.dispatch来调度ToastationCreators在creator的带领下，他来到商店展示祝酒词

希望这能帮助其他人。干杯

在我的ReduxScreen.js中，我添加了以下内容

import { Text, View, Button, StyleSheet } from "react-native";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import { ToastActionsCreators } from "react-native-redux-toast";

import { incrementCounter, decrementCounter } from "./actions/index";

  _displayInfoToast = () => {
    this.props.dispatch(ToastActionsCreators.displayInfo("Info toast!", 2000));
  };

const mapDispatchToProps = dispatch => {
  return {
    dispatch,
    ...bindActionCreators({ incrementCounter, decrementCounter }, dispatch)
  };
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(ReduxScreen);

我建议使用软件包

npm i——保存反应到僵硬状态

// Simply import these two objects:  
import { ToastContainer, toast } from 'react-toastify';     

  // Then make a toast function, something like this:
        success = () => toast.info("Data successfully saved", { autoClose: 2000 });

  // Somewhere in your code use your success toast function, like this:

saveNewUser = (data) => {
        getUsers.addUser(data).then(res=> {
            this.success();                     // Here we trigger the that toast        
        }).catch(error => {
            console.log('error while adding new user', error);
            throw(error);
        })
    }

    render() {
            const {userData} = this.state;
    return (
            <div className="container">

            // ...your logic goes here. This is just my example:
                       <table>
                            <thead>
                            <tr>
                                <th>Name</th>
                                <th>Date</th>
                                <th>Amount</th>
                                <th>Description</th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            {userData}
                            </tbody>
                        </table>

        // Here we trigger our function that will also trigger our success toast :)
                        <button type="button"
                         onClick={this.saveNewUser}>   
                         Save new user </button>

       // Then just before the last closing </div> insert this
      <ToastContainer autoClose={3000} closeOnClick />
</div>

//只需导入这两个对象：
从'react toastify'导入{ToastContainer，toast}；
//然后制作一个toast函数，类似这样：
success=（）=>toast.info（“数据成功保存”{autoClose:2000}）；
//在代码中的某个地方使用success toast函数，如下所示：
saveNewUser=（数据）=>{
getUsers.addUser（数据）。然后（res=>{
this.success（）；//在这里我们触发了这个吐司
}).catch（错误=>{
console.log（'添加新用户时出错'，错误）；
抛出（错误）；
})
}
render（）{
const{userData}=this.state；
返回(
//…你的逻辑是这样的。这只是我的例子：
名称
日期
数量
描述
{userData}
//在这里，我们触发的功能也将触发我们的成功祝酒词：）
保存新用户
//然后在最后一次结束前插入此
Hi.我从“react native redux toast”中添加了导入{toastationscreators}；但是，它仍然无法工作。我怀疑原因是模块提供的ActionCreator没有传递到我的ReduxScreen。我仍在试图找到解决方案。在添加ToastationCreators后，我得到以下错误_this.props.dispatch不是一个函数。我能够获得自己的自定义action Creator工作，但不是ToastationCreators谢谢你的建议。我正在查看react native redux toast，因为它与redux链接。我喜欢在我的动作中控制toast的显示，而不是在我试图保持表现的组件中