Gehen durch Udemy Tutorial und stecken geblieben und aus irgendeinem Grund kann nicht herausfinden, was happed. Ich habe meinen gesamten Code durchgegangen und es sieht soweit ich es beurteilen kann im Vergleich zum Tutorial aus. Code:reagieren und redux: Uncaught Error: Erwartet, dass der Reducer eine Funktion sein
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import ReduxPromise from 'redux-promise';
import App from './components/app';
import reducers from './reducers';
const createStoreWithMiddleware = applyMiddleware(ReduxPromise)(createStore);
ReactDOM.render(
<Provider store={createStoreWithMiddleware(reducers)}>
<App />
</Provider>
, document.querySelector('.container'));
searchbar.js:
import React, {Component} from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {fetchWeather} from '../actions/index';
export default class SearchBar extends Component{
constructor(props){
super(props);
this.state = {term: ''}
this.onInputChange = this.onInputChange.bind(this)
}
onInputChange(e){
console.log(e.target.value)
this.setState({
term: e.target.value
})
}
onFormSubmit(e){
e.preventDefault()
}
render(){
return (
<form onSubmit ={this.onFormSubmit} className = "input-group">
< input
placeholder =" Get a forecast"
className = "form-control"
value = {this.state.term}
onChange = {this.onInputChange}
/>
<span className = "input-group-btn">
<button type="submit" className = "btn btn-secondary">Submit </button>
</span>
</form>
);
}
}
function mapDispatchToProps(dispatch){
return bindActionCreators({fetchWeather}, dispatch);
}
export default connect (null, mapDispatchToProps)(SearchBar);
Reduzierungen/index.js
import axios from 'axios';
const API_KEY = 'c4c2ff174cb65bad330f7367cc2a36fa'
const ROOT_URL = `http://api.openweathermap.org/data/2.5/forecast?q=appid=${API_KEY}`;
export const FETCH_WEATHER = 'FETCH_WEATHER';
export function fetchWeather(city){
let url = `${ROOT_URL}&q=${city},us`;
let request = axios.get(url);
return {
type: FETCH_WEATHER,
payload: request
};
}
app.js
import React, { Component } from 'react';
import SearchBar from '../containers/search_bar';
export default class App extends Component {
render() {
return (
<div>
<SearchBar />
</div>
);
}
}
Vermissen Sie Code in Ihre Reduzierungen/Indexdatei? Es gibt dort keinen Reduzierer und Sie exportieren keinen Standard, so dass "Reduzierer" in Ihrer Hauptindex-Datei undefiniert sind. – azium
Die Funktion 'fetchWeather' in' reducers/index.js' sieht mehr wie eine Aktion aus, kein Reduzierer . Sind Sie sicher, dass Sie den bereitgestellten Code nicht falsch verstehen? –
@azium das ist der Code, der in der Anleitung war, ich muss nur das Video und es entspricht so weit wie ich kann sagen, das ist das Tutorial: https://www.udemy.com/react-redux/ learn/v4/t/lecture/4284600 – codemonkey