CODEWITHSUNDEEP
react-nativereact-redux
Saad El Qorchi
Saad El Qorchi

Reputation: 51

Array in a Redux State, React

I'm stuck and I can't find out how to store a dictionary in Redux State.

const productinuse = (state = [], action) => {
  switch (action.type) {
    case 'productinuse':
      return [...state, action.payload];
    default:
      return state;
  }
};
export default productinuse; 

animModal(product) {
    console.log(product);
    () =>
      store.dispatch({
        type: 'productinuse',
        payload: product,
      }),
      store.dispatch({type: 'toggleproductmodal'});
  }

Example of the dictionary that I'm trying to store on it :

{"UNIT": "Kg", "images": ["https://example.com/image.jpg"], "module_id": "1", "product_id": "6", "product_img": "example.com/image2.js", "product_name": "Ananas", "product_prix": "8.5", "product_text": "1 Kg Ananas."}

I always get the default empty array as a value.

EDIT

const initialState = {
  productinuse: [],
};
const productinuse = (state = initialState, action) => {
  console.log(action.payload + 'DEBUGGINS');
  switch (action.type) {
    case 'productinuse':
      return Object.assign({}, state, {
        productinuse: [...state, action.payload],
      });

    default:
      return state;
  }
};
export default productinuse;

**EDIT 2 **

<TouchableOpacity
                  key={product.product_id}
                  style={{width: '50%', position: 'relative'}}
                  onPress={() =>
                    this.setState(
                      {
                        product: product,
                      },
                      (product) =>
                        store.dispatch({
                          type: 'productinuse',
                          payload: product,
                        }),
                      () => store.dispatch({type: 'toggleproductmodal'})}>

Now When I perform the action I'm getting a TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a Symbol.iterator method.

Upvotes: 0

Views: 320

Answers (1)

BeHappy
BeHappy

Reputation: 3988

try this:

state:

const initialState = {
  productinuse: []
}

reducer:

const productinuse = (state = initialState, action) => {
  switch (action.type) {
    case 'productinuse':
      return Object.assign({}, state, {
        productinuse: [...state.productinuse, action.payload],
      });
    default:
      return state;
  }
};
export default productinuse;

Upvotes: 1

Related Questions