2017-12-07 26 views
1

私はReact Native with Redux-thunkミドルウェアを使用しています。 私の問題は、ディスパッチ関数はオブジェクトを返さず、コンソールもしません。ここでReact-Redux-Thunk:アクションがディスパッチを返さない

が私の行動はファイルです:

function movieSelc(movie) { 
    return { 
      type: types.MOVIE_SELECT, 
      selectedMovie: movie 
     }; 
} 

export function selectMovie(m) { 
    console.log("this console works!") 
    return (dispatch) => { 
    console.log("this console never works") 
    dispatch(movieSelc(m)); 
    }; 
} 

これは(私はそれが少し短くするためにここにconstのスタイルを含めておりません)コンポーネントです:

import React, { Component } from 'react'; 
import { Text, View, TouchableOpacity, Image, } from 'react-native'; 
import { connect } from 'react-redux'; 
import PropTypes from 'prop-types'; 
import { bindActionCreators } from 'redux'; 
import * as actions from './../actions'; 

class ListItem extends Component { 
    render() { 
     const { movie } = this.props; 
     return (

      <View> 
        { 
         movie && movie.map((item, index) => 
         <View key={index} style={styles.containerStyle}> 
          <Image 
           source={{ uri: `https://image.tmdb.org/t/p/w342${item.backdrop_path}` }} 
           style={styles.imgStyle} 
          /> 

          <TouchableOpacity 
           style={{ backgroundColor: 'gray' }} 
           onPress={() => { actions.selectMovie(item); }} 
          > 
            <Text style={styles.headStyle}>{item.title}</Text> 
            <Text>{item.overview}</Text> 
            <Text style={styles.rateStyle}> 
            Release Day:{item.release_date} 
            </Text> 
            <Text style={styles.rateStyle}>Rating: {item.vote_average}</Text> 
          </TouchableOpacity> 
         </View>) 
        } 
      </View> 

     ); 
    } 
} 
ListItem.propTypes = { 
    actions: PropTypes.object.isRequired, 
    movies: PropTypes.object.isRequired, 
}; 


function mapStateToProps(state) { 
    const { movies } = state; 
    return { 
     movies, 
    }; 
} 

function mapDispatchToProps(dispatch) { 
    return { 
     actions: bindActionCreators(actions, dispatch) 
    }; 
} 

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

私なら、私に知らせてください。より多くの情報を提供する必要があります。ありがとうございました!

答えて

1

あなたはディスパッチする代わりに、selectMovieアクションを呼び出しています。 bindActionToPropsメソッドを使用すると、react-reduxは、小道具を介してアクションをディスパッチする方法を提供するので、正しいコードは次のようになります。

<TouchableOpacity 
style={{ backgroundColor: 'gray' }} 
onPress={() => { this.props.actions.selectMovie(item)); }}> 
関連する問題