如何在redux中显示存储的数据

Question

我刚从反应/redux开始，并试图让我的头在商店/状态。我构建了一个成功接收数据的组件，然后将其传递给reducer。这是我的组件:

'use strict';
var React = require('react');
var PropTypes = React.PropTypes;
import axios from 'axios';
import store from '../../store';
import {getDataSuccess, getDataFail} from '../../actions/userData-actions'
import {connect} from 'react-redux';
class ServiceDetails extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tabs: null,
            tabContent: null
        }
    }
    componentDidMount() {
        axios.get('http://localhost:3001/0')
            .then(response => {
                console.log('getservicedetails=response.data', response.data);
                store.dispatch(getDataSuccess(response.data));
                return response;
            })
            .catch(function (error) {
                console.log(error);
                store.dispatch(getDataFail(error));
            });
    }
    render() {
        return (
            <section className="ServiceDetails">
                <h1>id:{props.userData.users[0].id}</h1>
                service details new
            </section>
        )
    }
}

const mapStateToProps = function (store) {
    console.log('Servicedetails mapStatetoprops =',store );
    return {
        data: store.datas,
        userData: store.apiData
    };
};
export default connect(mapStateToProps)(ServiceDetails);

mapstatetoProps函数接收数据，但是我如何呈现这些数据?如何显示来自存储的数据?

Answer 1

我在你的代码中看不到reducer。还有你的函数this

const mapStateToProps = function (store) {
  return {
    data: store.data,
    userData: store.apiData
  };
};

将新状态映射到props， &这将重新渲染你的组件。结果是你的组件将被更新为新的/更新过的数据。

如果可能的话，也请验证和修复这些东西:

你应该使用this.props.userData而不是props。
• 使用Provider，以便在所有组件中使用store。

还有一件事，在mapStateToProps函数中输入[" data "]。单个数据单位称为基准;多个数据称为数据，而不是数据。

Answer 2

我找到了，我正在检查数组长度是否大于0之前渲染它