logo
down
shadow

in React + Redux, when should use response.json()


in React + Redux, when should use response.json()

By : SpencerS
Date : November 21 2020, 11:01 PM
this one helps.
It depends what you actually requesting and what you wants to do with the response.
code :
var myImage = document.querySelector('.my-image');
fetch('flowers.jpg').then(function(response) {
  return response.blob(); // here 
}).then(function(response) {
  var objectURL = URL.createObjectURL(response);
  myImage.src = objectURL;
});


Share : facebook icon twitter icon
Structuring Normalized JSON response in Redux store and mapping to React component props

Structuring Normalized JSON response in Redux store and mapping to React component props


By : Harouna Komoye
Date : March 29 2020, 07:55 AM
To fix this issue Summary
I'm suggesting that you refactor your state to look like:
code :
{
  network: {
    loading: false,
    failure: false
  },
  advisors: { allIds, byId },
  opportunities: { allIds, byId },
  programs: { allIds, byId },
  prospects: { allIds, byId },
}
function network(state = { loading: false, failure: false }, action) {
  switch (action.type) {
    case constants.REQUEST_PAYLOAD:
      return { ...state, fetching: true };
    case constants.RECEIVE_PAYLOAD:
      return { ...state, fetching: false, failure: false };
    case constants.prospects.REQUEST_PROSPECTS_FAILURE:
      return { ...state, fetching: false, failure: true };
    default:
      return state;
  }
}
function prospects(state = { allIds: [], byId: {} }, action) {
  switch (action.type) {
    case constants.RECEIVE_PAYLOAD:
      // depending on your use case, you may need to merge the existing
      // allIds and byId with the action's. This would allow you to 
      // issue the request multiple times and add to the store instead
      // of overwriting it each time.
      return { ...state, ...action.data.prospects };
    default:
      return state;
  }
}
case constants.prospects.RECEIVE_PROSPECTS:
  return Object.assign({}, state, {
    fetching: false,
    entities: action.data,
  });
case constants.prospects.RECEIVE_PROSPECTS:
  return { 
    ...state,
    fetching: false,
    entities: action.data.prospects,
  };
How to cache API response and use it later in react & redux?

How to cache API response and use it later in react & redux?


By : Jonathan Rhodes
Date : November 23 2020, 03:01 PM
wish help you to fix your issue you can cache in HDD or RAM.
HDD = e.g. localStorage RAM = application state, e.g. redux store.
React/Redux - Passing JSON data from one API call to another Redux action using Thunk

React/Redux - Passing JSON data from one API call to another Redux action using Thunk


By : yasser kayalli
Date : March 29 2020, 07:55 AM
like below fixes the issue I'm new to Redux and I am sending an API request to the Spotify API. I am using Thunk and have an action called FetchCurrentlyPlaying which fetches the current song that is being played. , You can dispatch other actions from your thunk
code :
const FetchAlbums = albumId => dispatch => axios(albumId)
  .then((data) => {
    dispatch(setAlbum(data));
  });

const FetchCurrentlyPlaying = song => dispatch => axios(song)
  .then((data) => {
    dispatch(setSong(data));
    dispatch(FetchAlbums(data.albumId));
  });
Object of objects JSON response from Django backend to React-Redux frontend

Object of objects JSON response from Django backend to React-Redux frontend


By : Adam Anderson
Date : March 29 2020, 07:55 AM
wish of those help You should be able to build a dictionary in the ArticleViewSet's list method:
code :
class ArticleViewSet(ViewSet):
    queryset = Article.objects.all()

    def list(self, request):
        serializer = ArticleSerializer(ArticleViewSet.queryset, many=True)
        return Response({article['id']: article for article in serializer.data})

    def retrieve(self, request, pk=None):
        # ...
I can't get a response from github api using redux with react.js

I can't get a response from github api using redux with react.js


By : duytinhit
Date : March 29 2020, 07:55 AM
Does that help The returned json from the server has body.items, you are trying to read it from body.repos.
Change your action to:
code :
export function fetchRepos() {
  return function(dispatch) {
    dispatch({
      type: "FETCH_REPOS_REQUEST",
    });

    return fetch(
      "https://api.github.com/search/repositories?q=sort=stars&order=desc",
    )
      .then(response => response.json().then(body => ({response, body})))
      .then(({response, body}) => {
        if (!response.ok) {
          dispatch({
            type: "FETCH_REPOS_FAILURE",
            error: body.error,
          });
        } else {
          dispatch({
            type: "FETCH_REPOS_SUCCESS",
            repos: body.items,
          });
        }
      });
  };
}
Related Posts Related Posts :
  • how to pass the value of one input to another input's onBlur event in reactjs?
  • Firebase: Render list of posts created with .push in React component
  • Element type is invalid (got: undefined) for react-redux component
  • React's setState(), data mutation for nested structures, why not modify state directly?
  • Dispatching an action in a specific component based on a reducer state change
  • using React component library without @types
  • How to parse a string with variables into a react component?
  • How to move reactjs components into seperate page when using CDN
  • create-react-app and d3 - Why is d3 undefined?
  • react-router tutorial not working on mac
  • Using lodash in shouldComponentUpdate
  • Deploying build to production using express server which i compiled using webpack -p
  • How to write interceptor in react-redux?
  • XJS value should be either an expression or a quoted XJS text
  • How to display 12months with material-ui
  • Reordering a sequence of objects in a normalised Redux data structure
  • Markdown in React with Typescript
  • Is it an efficient practice to add new epics lazily inside react-router onEnter hooks?
  • React: Execute some check before render
  • Set component's props dynamically
  • Webpack + Babel: Couldn't find preset "es2015" relative to directory
  • What is the right way to fire an action with siblings state in React/Flux?
  • React-server failling without error
  • Add Server Side Rendering to create-react-app
  • Should I store static configuration in redux?
  • State is not updating in componentWillMount
  • How to envoke a method on a react component (Amcharts-React)
  • HOC vs Wrapper in render function
  • Need to find the way to slice this array to show only n customers
  • Do I need to specify the key prop in this case and how would I do that then?
  • rror: FactoryMethod.render(): A valid React element (or null) must be returned.
  • How to pass a function instead of string as a prop to a component
  • what is wrong with 'this.setState'
  • Use ref to invoke instance methods
  • How to keep two separate categories under the same list, but keep other categories separated per se?
  • Stateless function components cannot hav refs
  • Update array object in React Redux reducer
  • PropTypes React Native is not an object
  • Jest test fail: SyntaxError: Unexpected token <
  • React Redux form and connect syntax
  • Can anyone provide an example on React-Redux Jest testing?
  • React server side renderer omits setState callback function?
  • Bootstrap Checkbox Not Toggling
  • distorted map image when using react-leaflet
  • react-scripts Invalid Host header
  • remove text from button that created in loop
  • how to limit redux-form's fieldArray field.push to 3
  • Referencing state for loop rendered elements in react
  • React Native update multidimensional state value on switch press
  • Draft.js - How to trim contents
  • how to syncState to firebase with re-base?
  • React component test with enzyme
  • Under what circumstances React class component will be constructed many times?
  • react-native 0.49 brackets after base class
  • shadow
    Privacy Policy - Terms - Contact Us © soohba.com