警告：道具类型失败：道具 'hasError' 在 'PostList' 中被标记为必需，但它的值为 'undefined '

Question

我对 React Native 和 Redux 还很陌生，并且正在跟随 this tutorial 在我的应用程序中实现 Redux。当我加载我的 PostList 组件时，我收到以下针对 hasError 和 isLoading 捕获的警告，如以下屏幕截图所示。

对于问题中即将嵌入的大量源代码，我深表歉意，我尝试删除了不必要的代码。

PostList.js（组件）

[unnecessary import statements]

import { fetchPosts, postsFetchError, postsFetchLoading } from '../actions/PostsActions';

class PostList extends Component {

    static navigationOptions = ({navigation}) => {
        [redacted]
    }

    renderPosts = ({ _id, upvotes, downvotes, message, datetime }, i) => {
        [redacted]
    }

    componentDidMount() {
        this.props.fetchData('[redacted]');
    }

    render() {
        if (this.props.hasError) {
            return (
                <View style={styles.center}>
                    <Text>
                        Failed to load posts!
                    </Text>
                </View>
            )
        }

        if (this.props.isLoading) {
            return (
                <View style={styles.center}>
                    <ActivityIndicator animating={true} />
                </View>
            )
        }

        this.props.posts.sort(function(a,b) {
            return Date.parse(b.datetime) - Date.parse(a.datetime);
        })

        return (
            <ScrollView style={styles.container}>
                {this.props.posts.map(this.renderPosts)}   
            </ScrollView>                        
        )
    }
}

PostList.propTypes = {
    fetchData: PropTypes.func.isRequired,
    posts: PropTypes.array.isRequired,
    hasError: PropTypes.bool.isRequired,
    isLoading: PropTypes.bool.isRequired
};

const mapStateToProps = (state) => {
    return {
        posts: state.posts,
        hasError: state.postsFetchError,
        isLoading: state.postsFetchLoading
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        fetchData: (url) => dispatch(fetchPosts(url)),
    };
};

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

PostsActions.js

import axios from 'axios';

export function postsFetchError(bool) {
    return {
        type: 'POSTS_FETCH_ERROR',
        hasError: bool
    };
}

export function postsFetchLoading(bool) {
    return {
        type: 'POSTS_FETCH_LOADING',
        isLoading: bool
    };
}

export function postsFetchSuccess(posts) {
    return {
        type: 'POSTS_FETCH_SUCCESS',
        posts
    };
}

export function fetchPosts(url) {
    return (dispatch) => {
        dispatch(postsFetchLoading(true));

        axios.get(url)
            .then((response) => {
                if (response.status !== 200) {
                    throw Error(response.statusText);
                }

                dispatch(postsFetchLoading(false));

                return response;
            })
            .then((response) => dispatch(postsFetchSuccess(response.data)))
            .catch(() => dispatch(postsFetchError(true)));
    };
}

PostsReducers.js

export function postsError(state = false, action) {
    switch (action.type) {
        case 'POSTS_FETCH_ERROR':
            return action.hasError;
        default:
            return state;
    }
}

export function postsLoading(state = false, action) {
    switch (action.type) {
        case 'POSTS_FETCH_LOADING':
            return action.isLoading;
        default:
            return state;
    }
}

export function posts(state = [], action) {
    switch (action.type) {
        case 'POSTS_FETCH_SUCCESS':
            return action.posts;
        default:
            return state;
    }
}

在索引中组合缩减器并配置存储都工作正常，我没有收到实际获取帖子的操作和缩减器的警告。我的代码与教程的示例相匹配，但如果有人发布了具有未解决警告的教程，我会感到震惊（然后这又是 Javascript 开发，所以我想一切都会发生）。我可以为任何好奇的人添加更多信息。感谢任何提供帮助的人。

Answer 1

是否因为：

const mapStateToProps = (state) => {
    return {
        posts: state.posts,
        hasError: state.**postsFetchError**,
        isLoading: state.**postsFetchLoading**
    };
};

不匹配：

export function **postsError**(state = false, action) {
export function **postsLoading**(state = false, action)

警告：道具类型失败：道具 'hasError' 在 'PostList' 中被标记为必需，但它的值为 'undefined '

Warning: Failed Prop Type: The prop 'hasError' is marked as required in 'PostList', but it's value is 'undefined '

javascript

reactjs

react-native

redux-thunk

react-redux