Question

我第一次尝试使用redux时，我没有得到输出。任何人都可以帮助我。

组件

import * as storyboardActions from '../actions/storyboardActions';
handleClickHello() {
    this.props.storyboardActions.testAction();
}

<div>
    <h4>This is the dashboard</h4>
    <a onClick={this.handleClickHello.bind(this)}>Knock Knock</a>
</div>

动作

const API_URL = 'http://localhost:3000/api';  
export function testAction() {
    return function (dispatch) {
        axios.get(`$(API_URL)/helloworld`) .
            then(response => {
                dispatch({
                    type: types.TEST_ACTION,
                    payload: response.data,
                });
                console.log(response.data);
            })
            .catch((error) => {
                console.log(error);
            });
    };
}

减速

export default function (state = initialState.storyboard, action) {
    switch (action.type) {
    case types.ADD_NEW_STORYBOARD: {
        const board = {
            id: uuid(),
            boardTitle: 'A',
        };
        return [...state, board]
    }

    case types.TEST_ACTION:
    {
        return { ...state, message: action.payload.message };
    }
    default:
        return state;
    }
}

初始状态

export default {
    storyboard: [{
        id: '1fef',
        boardTitle: 'B1',
        message: ''
    }],
};

尝试获取输出问候语，但我无法看到。

这是我正在接近的正确方法吗？

Answer 1

只需将状态更改为：

storyboard: {
    id: '1fef',
    boardTitle: 'B1',
    message: ''
}

并在以下case types.ADD_NEW_STORYBOARD中进行更改：

return {...state, id: uuid(), boardTitle: 'A'};

React-Redux-不获取输出

1 个答案: