redux

How to dispatch an action with current value of state?

落爺英雄遲暮 提交于 2021-02-10 16:40:02
问题 I have an angular component showing items in a list. Each itemn can be selected and the ids of the selected items will be stored in the state. So my state object looks like this f.e.: { items: Item[]; selected: string[] } Now I got an action called DeleteSelectedAction that gets selected as payload. This action will call some WebAPI using an effect and so on. Now I found two ways how I could do this. First: Select selected from store and subscribe to it and pass the value with the action

Nesting `combineReducers` doesn't let to have state without nested objects

荒凉一梦 提交于 2021-02-10 07:26:09
问题 I have bookManageReducer.jsx : import { combineReducers } from 'redux' import { REQUEST_BOOKS_PAGE, RECEIVE_BOOKS_PAGE } from '../constants/dashboardConstants' const books = (state = [], action) => { switch (action.type) { case RECEIVE_BOOKS_PAGE: return action.books default: return state } } const booksState = (state = {isFetching: false}, action) => { switch (action.type) { case REQUEST_BOOKS_PAGE: return {isFetching: true} case RECEIVE_BOOKS_PAGE: return {isFetching: true} default: return

What are the cons of deep copying state on each reducer call in Redux application?

烂漫一生 提交于 2021-02-10 05:33:09
问题 Are there any side effects of doing a deep copy of state on the appReducer in a Redux application each time a reducer function is called? I'm asking because the Immutable Update Pattern docs for Redux state that to update a nested object on state, you should shallow copy the nested property and update it. I'm curious what the side effects would be for just doing a deep copy on state on every action call. Here is some pseudo code for example export default function appReducer(state =

Using redux-api-middleware to process image/jpeg content

孤人 提交于 2021-02-10 05:09:54
问题 I have an RSAA (Redux Standard API-calling Action) that I'm using to retrieve image/jpeg content. All the examples I've seen deal with JSON data so I copied the getJSON function and implemented my own getImage function to deal with this content type. The problem I'm now running into is that this blob needs to be converted to base64 and that has to be done using an async function. So, my FSA gets triggered before this async operation completes. I suspect that I need to somehow piggyback on the

Using redux-api-middleware to process image/jpeg content

半腔热情 提交于 2021-02-10 05:07:47
问题 I have an RSAA (Redux Standard API-calling Action) that I'm using to retrieve image/jpeg content. All the examples I've seen deal with JSON data so I copied the getJSON function and implemented my own getImage function to deal with this content type. The problem I'm now running into is that this blob needs to be converted to base64 and that has to be done using an async function. So, my FSA gets triggered before this async operation completes. I suspect that I need to somehow piggyback on the

Using redux-api-middleware to process image/jpeg content

我的未来我决定 提交于 2021-02-10 05:05:03
问题 I have an RSAA (Redux Standard API-calling Action) that I'm using to retrieve image/jpeg content. All the examples I've seen deal with JSON data so I copied the getJSON function and implemented my own getImage function to deal with this content type. The problem I'm now running into is that this blob needs to be converted to base64 and that has to be done using an async function. So, my FSA gets triggered before this async operation completes. I suspect that I need to somehow piggyback on the

「前端工程化」该怎么理解?

自作多情 提交于 2021-02-09 13:40:10
关注「 前端向后 」微信公众号,你将收获一系列「用 心 原创」的高质量技术文章,主题包括但不限于前端、Node.js以及服务端技术 一.什么是前端工程? 一个类似的术语是软件工程(Software Engineering): Software engineering is the systematic application of engineering approaches to the development of software. 将工程方法系统化地应用到软件开发中,就叫软件工程 。那么,紧接着又有两个问题: 工程方法是什么? 系统化怎么理解? 工程是指使用科学原理设计和制造机器、结构等,比如修桥、铺路、建隧道、造车、盖房子: Engineering is the use of scientific principles to design and build machines, structures, and other items, including bridges, tunnels, roads, vehicles, and buildings. 具体到软件领域,指的是 以系统、严谨、可量化的方法开发、运营、维护软件 ,软件工程包括对这些方法的应用和研究: Software engineering the application of a systematic,

Handling Redux Saga result in view from which action call originates

微笑、不失礼 提交于 2021-02-09 10:57:33
问题 I'm new to Redux Saga, coming from Redux Thunk. In some situations, I need to know whether an API call fails or succeeds from inside the view from which I called the action. With Redux Thunk, I would do something like the following. My component and action creator would look like this: class MyComponent extends Component { componentDidMount() { this.props.actions.fetchItems() .then(result => { if (result.status === 'OK') { console.log('Request succeeded, take particular action in this view')

Handling Redux Saga result in view from which action call originates

喜你入骨 提交于 2021-02-09 10:57:15
问题 I'm new to Redux Saga, coming from Redux Thunk. In some situations, I need to know whether an API call fails or succeeds from inside the view from which I called the action. With Redux Thunk, I would do something like the following. My component and action creator would look like this: class MyComponent extends Component { componentDidMount() { this.props.actions.fetchItems() .then(result => { if (result.status === 'OK') { console.log('Request succeeded, take particular action in this view')

Updating state in reducer using variables

旧时模样 提交于 2021-02-09 10:32:56
问题 I'm build a simple app that expands and collapses sections of content based on their state. Basically, if collapse = false, add a class and if it's true, add a different class. I'm using Next.js with Redux and running into an issue. I'd like to update the state based on an argument the action is passed. It's not updating the state and I'm not sure why or what the better alternative would be. Any clarification would be great! // DEFAULT STATE const defaultState = { membership: 'none',