首页 > 解决方案 > 将数据获取存储在本地状态 redux reactjs

问题描述

我尝试将获取日期存储在本地状态,而不是存储在我的应用程序的全局存储中。

(...)
.then(response => response.json())
.then (data => dispatch(fetchSuccess(data)))

接着 :

export const FETCH_SUCCESS = 'FETCH_SUCCESS';
function fetchSuccess(create) {
    return {type : FETCH_SUCCESS, payload: create}
}

我在减速器中有我的数据:

const initialState = {
   eCreate: ''
};
case FETCH_SUCCESS:
      return {...state, eCreate: action.payload}

在我的组件中有我的状态之后:

rEvt : state.redu.eCreate

我可以显示:

console.log(rEvt)

但是我的状态 eCreate 在我的所有应用程序中都可用。我只是希望这个状态只在这个组件中可用。我怎样才能做到这一点 ?感谢帮助。

标签: javascriptreactjsredux

解决方案


我的组件

function Create(props) {

    const {cEvt, sEvt, gtf, rEvt} = props;

    console.log(rEvt)


    if (rEvt.name === sEvt)
    {
        return <Redirect to={"/d/" + rEvt.name} />
    }


    return (
        <div >
            <input type="text" value={sEvt} onChange={e => cEvt(e.target.value)} />
            <button onClick={() => gtf(sEvt)} >Go !</button>

        </div>
    );
}

还有我的组合容器:

const mapStateToProps = (state) => ({
    sEvt : state.redu.sCreate,
    rEvt : state.redu.eCreate
})

const mapDispatchToProps = dispatch => ({
    cEvt : e => dispatch(changeInput(e)),
    gtf : (name) => dispatch(fetchCreate(name))
})

我的 fetch 有一个方法 POST 来创建一个带有输入名称的新条目。


推荐阅读