不断收到“对象不是函数”错误

时间:2018-11-28 00:29:41

标签: reactjs react-native redux react-redux redux-thunk

我的Main.js文件中始终出现错误“对象不是函数...”。该如何解决?我在做什么错?以下是错误的屏幕截图:enter image description here。这也是我Main.js文件的代码:

import React from 'react';
import { StyleSheet, Text, Image, View, Vibrate } from 'react-native';

import Settings from './Settings';
import Profile from './Profile';

import {connect} from 'react-redux';
import {saveProfile, saveSettings} from '../redux/actions';

class Main extends React.Component {

  componentWillMount() {
        if (!this.props.avatarUrl) {
            this.props.saveProfile(this.props.location);
        }
    }

  render() {
    return (
      <View style={styles.container, bgColor}>
        <Image
          source={this.props.avatarUrl}
          style={{width: 300, height: 300}}
        />
        <Text>{this.props.name}</Text>
        <Text>{this.props.phone}</Text>
        <Text>{this.props.email}</Text>
        <Settings />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

export default saveProfile (
  connect(
    state=>state.location,
    {saveProfile}
  )
)(Main);

我的目标是显示保存在redux中的信息。

2 个答案:

答案 0 :(得分:1)

您的问题是您导出主模块的方式以及连接redux以利用道具的方式,我为您提供以下示例,让您大致了解redux的使用... `

actions.js

import * as ACTIONS from './types';

export const reset = () => {
  return { type: ACTIONS.RESET_STATE };
};

export const saveProfile = profile => {
  return { type: ACTIONS.SAVE_PROFILE, payload: profile };
};

export const saveSettings = settings => {
  return { type: ACTIONS.SAVE_SETTINGS, payload: settings };
};

reducer.js

import * as ACTIONS from './../actions/types';

const INITIAL_STATE = {
  profile: 0,
  settings: 0
};

export default (state = INITIAL_STATE, action) => {
  switch (action.type) {
    case ACTIONS.RESET_STATE:
      return { ...INITIAL_STATE };
    case ACTIONS.SAVE_PROFILE:
      return { ...state, profile: action.profile };
    case ACTIONS.SAVE_SETTINGS:
      return { ...state, settings: action.settings };
    default:
      return state;
  }
};

index.js / combinereducers

import { combineReducers } from 'redux';

import reducers from './reducer.js';

export default combineReducers({
  reducer: reducers
});

和用法到您的主类

import { saveProfile, saveSettings } from './../redux/actions/index.js';

class Main extends Component {
  constructor(props) {
    super(props);
    this.state = {
      saveProfile: this.props.profile,
      saveSettings: this.props.settings
    };
{.....



.....}

const mapStateToProps = ({ reducers }) => {
  const { profile, settings } = reducers;

  return { profile, settings };
};

export default connect(mapStateToProps, { saveProfile, saveSettings })(Main);

希望对您有帮助

答案 1 :(得分:0)

该错误似乎来自底部的导出默认语句。此特定的导出看起来可能存在语法错误,因此请仔细检查您所使用的示例中的导出结构。