Как передать объект в Redux - PullRequest
       5

Как передать объект в Redux

0 голосов
/ 06 ноября 2019

Я хотел бы спросить вас о передаче объекта в Redux. Ниже приведен мой код.

// src/actions/writingType.js
export const write = () => ({
    type: 'WRITE',
})

export const update = (obj) => ({

    type: 'UPDATE',
    obj
})
// src/reducers/writingType.js
const initialState = {
    writingType: "WRITE",
    obj: null
}

const writingTypeReducer = (state = initialState, action) => {
    console.log('\n inside writingTypeReducer');
    console.log(action);
    switch (action.type) {
        case 'WRITE':
            return {
                ...state,
                writingType: 'WRITE'
            };
        case 'UPDATE':
            return {
                ...state,
                writingType: 'UPDATE',
                obj: action.obj
            };
        default:
            return state;
    }
}

export default writingTypeReducer;
// Contentview.js

import React, { useContext } from 'react';
import { Route, Link } from 'react-router-dom';
import MarkdownRenderer from 'react-markdown-renderer';
import './Contentview.css';
import { connect } from 'react-redux'
import { write, update } from '../../actions/writingType'
import { UserConsumer } from '../../contexts/userContext';
import { Test } from '../../contexts/Test';



const Contentview = (props) => {

    /*
    category: "React"
    contentObj:
        contents: "something"
        createdDatetime: "2019.10.26 08:52:05"
        title: "something"
        wikiIndex: 1
    */
    console.log('\n Contentview');
    console.log(props);
    console.log('\n update(props.contentObj);');
    update(props.contentObj);

    const url = "/editor/" + props.category;
    const updateUrl = "/update/" + props.category;

    return (
        <div>
            <div className="catagoryDiv">{props.category}</div>
            <div className="writingDiv"><Link to={url}> A </Link></div>
            <div className="updateDiv"><Link to={updateUrl} > B </Link></div>

            <hr />
            <MarkdownRenderer markdown={props.contentObj.contents} />

        </div>
    );
};

// export default Contentview;

const mapStateToProps = (state, props) => ({
    writetypestate: state.writingType,
    obj: props.contentObj
})

const mapDispatchToProps = dispatch => ({
    write: () => dispatch(write()),
    update: (obj) => {
        console.log('Contentview, mapDispatchToProps, update');
        dispatch(update(obj))
    }
})

export default connect(mapStateToProps, mapDispatchToProps)(Contentview)

Я использовал update (props.contentObj);в Contentview.js передать props.contentObj в Redux и обновить obj initialState в src / redurs / writingType.js. Но объект initialState не изменился и существовал как ноль.

Как мне изменить код?

Спасибо.

1 Ответ

1 голос
/ 06 ноября 2019

используйте props.update для вызова в главном файле

// Contentview.js

import React, { useContext } from 'react';
import { Route, Link } from 'react-router-dom';
import MarkdownRenderer from 'react-markdown-renderer';
import './Contentview.css';
import { connect } from 'react-redux'
import { write, update } from '../../actions/writingType'
import { UserConsumer } from '../../contexts/userContext';
import { Test } from '../../contexts/Test';



const Contentview = (props) => {

    /*
    category: "React"
    contentObj:
        contents: "something"
        createdDatetime: "2019.10.26 08:52:05"
        title: "something"
        wikiIndex: 1
    */
    console.log('\n Contentview');
    console.log(props);
    console.log('\n update(props.contentObj);');
    props.update(props.contentObj);

    const url = "/editor/" + props.category;
    const updateUrl = "/update/" + props.category;

    return (
        <div>
            <div className="catagoryDiv">{props.category}</div>
            <div className="writingDiv"><Link to={url}> A </Link></div>
            <div className="updateDiv"><Link to={updateUrl} > B </Link></div>

            <hr />
            <MarkdownRenderer markdown={props.contentObj.contents} />

        </div>
    );
};

// export default Contentview;

const mapStateToProps = (state, props) => ({
    writetypestate: state.writingType,
    obj: props.contentObj
})

const mapDispatchToProps = dispatch => ({
    write: () => dispatch(write()),
    update: (obj) => {
        console.log('Contentview, mapDispatchToProps, update');
        dispatch(update(obj))
    }
})

export default connect(mapStateToProps, mapDispatchToProps)(Contentview)

Пожалуйста, используйте указанный выше код

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...