React - Redux - Dispatch Action Error、this.props.mostrarProdutoは関数ではありません

Question

私のコンテナに2アクションをディスパッチしていますが、this.props.mostrarProduto（）を取得し続け、this.props.esconderProduto（）は関数。目的は、コンポーネントの表示と非表示を切り替えるマウスオーバーアクションを作成することです。

おかげ

コンテナメニュー

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { bindActionCreators } from 'redux'; 
import { mostrarProduto } from '../actions/index'; 
import { esconderProduto } from '../actions/index'; 

class Menu extends Component{ 

render(){ 
    return (
     <div onMouseOver={this.props.mostrarProduto()} onMouseLeave={this.props.esconderProduto()}> 
      <ul> 
       <li><a href="#">Link 1</a></li> 
      </ul> 
     </div> 
    ) 
    } 

} 

function mapDispatchToProps(dispatch) { 

return bindActionCreators({mostrarProduto, esconderProduto}, dispatch); 
} 

export default connect(null, mapDispatchToProps)(Menu); 

アクションインデックス

function mostrarProduto(){ 
    return { 
     type: 'SHOW_PRODUCT' 
    } 
} 

function esconderProduto(){ 
    return { 
     type: 'HIDE_PRODUCT' 
    } 
} 

製品リデューサ

あなたはすべてのアクションを輸出していない

const productReducer = (state = false, action) => { 
    switch (action.type) { 
    case 'SHOW_PRODUCT': 
     return true; 
    case 'HIDE_PRODUCT': 
     return false; 
    default: 
     return state; 
    } 
} 

減速指数

import { combineReducers } from 'redux'; 
import Produtos from './texto_produto'; 

const rootReducer = combineReducers({ 
    textoProdutos : Produtos 
}); 

export default rootReducer; 

Answer 1

。あなたが名前の輸入を使用しているので、コードは次のようになります。@vlad

export function mostrarProduto(){ 
    return { 
     type: 'SHOW_PRODUCT' 
    } 
} 

export function esconderProduto(){ 
    return { 
     type: 'HIDE_PRODUCT' 
    } 
}