Question

我在JS课程中使用export * ...和someFunc = () => {}。但是，出于某种原因，他们并没有以反应原生的方式工作。

这是SomeActionFile.js中的行动创建者：

export const userChangedSummary = (summaryText) => {
    return {
        type: 'SUMMARY_CHANGED',
        payload: summaryText
    };
};

然后在我的actions/index.js我这样做：

export * from './someDirectory/SomeActionFile';

在我的组件中，我只是在我的动作创建者中调用该函数：

    import { setUserCountry } from '../../actions';

    class SomeComponent extends PureComponent<{}> {
    summaryChanged = (summary) => {
            this.props.userChangedSummary(summary);
        };

renderYears = YearsFuture.map((item, i) => {
        return <Picker.Item key={i} value={item} label={item}/>
    });

     render() {
            return (

                                    <Input
                                        placeholder={'About'}
                                        onChangeText={this.summaryChanged.bind(this)}
                                        value={this.props.userProfile.summary}
                                        maxLength={240}
                                        multiline={true}
                                    />

<Picker style={{flex: 1,}}
                                        onValueChange={this.onValueToYearChange}
                                        selectedValue={this.props.educationToYear}>
                                    {this.renderYears}
                                </Picker>
            );
        }

    }

    export default connect(mapStateToProps, { setUserCountry})(SomeComponent);

这会显示错误：userChangedSummary is undefined

但是当我像这样导入时import { setUserCountry } from '../../someDirectory/SomeActionFile';它有效。所以我不知道什么是错的。

另外renderYears also goes undefined

所有这一切都工作正常，直到昨天。我现在不知道什么是错的。：/

任何想法????完全停留在这里。

Answer 1

我认为没有定义名为

的Action

setuserCountry 在someactionfile.js
中

Answer 2

您尚未添加userChangedSummary作为SomeComponent的道具。

下面的一行显示您只将一个动作setUserCountry映射到SomeComponent。

export default connect(mapStateToProps, { setUserCountry })(SomeComponent);

在SomeComponent文件中，尝试导入userChangedSummary。

import { setUserCountry, userChangedSummary } from '../../actions';

我还建议使用bindActionCreators()

将值为动作创建者的对象转换为具有相同键的对象，但将每个动作创建者包装到一个调度调用中，以便可以直接调用它们。

来源：https://redux.js.org/docs/api/bindActionCreators.html

简单地添加到SomeComponent

import { bindActionCreators } from 'redux';

...


const mapDispatchToProps = dispatch => bindActionCreators({
  setUserCountry, 
  userChangedSummary
}, dispatch);

...

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

这将允许您执行this.props.userChangedSummary()并使用bindActionCreators，它将自动发送。

export *和fat arrow函数不能在react-native中工作

2 个答案: