在React + Redux中，操作不会触发Reducer

我正在开发react-redux应用程序，并且出于某种原因我调用的操作没有到达reducer（其中我目前只有一条日志语句）。我已附上我认为相关的代码，任何贡献将不胜感激。在React + Redux中，操作不会触发Reducer

操作在组分函数内部调用：

onSearchPressed() { 
    console.log('search pressed'); 
    this.props.addToSaved(); 
}

动作/ index.js：

var actions = exports = module.exports 

exports.ADD_SAVED = "ADD_SAVED"; 

exports.addToSaved = function addToSaved() { 
    console.log('got to ADD_SAVED step 2'); 
    return { 
    type: actions.ADD_SAVED 
    } 
}

减速器/ items.js：

const { 
    ADD_SAVED 
} = require('../actions/index') 

const initialState = { 
    savedList: [] 
} 

module.exports = function items(state = initialState, action) { 
    let list 

    switch (action.type) { 
     case ADD_SAVED: 
      console.log('GOT to Step 3'); 
      return state; 
     default: 
      console.log('got to default'); 
      return state; 
    } 
}

减速器/ index.js：

const { combineReducers } = require('redux') 
const items = require('./items') 

const rootReducer = combineReducers({ 
    items: items 
}) 

module.exports = rootReducer

店/配置-store.js：

import { createStore } from 'redux' 
import rootReducer from '../reducers' 

let store = createStore(rootReducer)

编辑：为onSearchPressed整个组件：

class MainView extends Component { 
    onSearchPressed() { 
     this.props.addToSaved(); 
    } 
    render() { 
     console.log('MainView clicked'); 
     var property = this.props.property; 

     return (
      <View style={styles.container}> 
       <Image style={styles.image} 
        source={{uri: property.img_url}} /> 
       <Text style={styles.description}>{property.summary}</Text> 
       <TouchableHighlight style = {styles.button} 
         onPress={this.onSearchPressed.bind(this)} 
         underlayColor='#99d9f4'> 
         <Text style = {styles.buttonText}>Save</Text> 
        </TouchableHighlight> 
      </View> 
     ); 
    } 
} 

module.exports = MainView;

来源

2016-04-22 user3802348

检查的console.log上onSearchPressed（this.props）（），并确保它不为空 – QoP

@QoP的console.log（this.props）正确填充。 – user3802348

这很奇怪！尝试改变exports.addToSaved =功能addToSaved（）{}以exports.addToSaved =函数（）{} – QoP

正如里克·乔利在你的问题中提到的意见，你的onSearchPressed()功能实际上并不调度该动作，因为addToSaved()只是返回一个动作对象 - 它不派遣任何东西。

如果你想从一个组件调度操作，您应该使用react-redux你的份（S）连接到终极版。例如：

const { connect } = require('react-redux') 

class MainView extends Component { 
    onSearchPressed() { 
    this.props.dispatchAddToSaved(); 
    } 
    render() {...} 
} 

const mapDispatchToProps = (dispatch) => { 
    return { 
    dispatchAddToSaved:() => dispatch(addToSaved()) 
    } 
} 

module.exports = connect(null, mapDispatchToProps)(MainView)

查看'Usage With React' section of the Redux docs了解更多信息。

来源

2016-05-01 10:07:25

在React + Redux中，操作不会触发Reducer

回答

相关问题