Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

203
Vistas
./src/actions/productActions.js Attempted import error: 'PRODUCT_LIST_FAIL' is not exported from '../reducers/productReducers'

i have tried many times to solve this error, but i couldn't do it. with it I don't know what to do next. i have tried all the way to get solution but its not working out.

 import axios from "axios"
    import  {PRODUCT_DETAILS_FAIL,PRODUCT_DETAILS_REQUEST,PRODUCT_DETAILS_SUCCESS}  from "../constants/productConstants";
    import {PRODUCT_LIST_FAIL,PRODUCT_LIST_REQUEST,PRODUCT_LIST_SUCCESS}  from "../reducers/productReducers"
    
    const listProducts = () => async (dispatch) =>{
    try{
        dispatch({type:PRODUCT_LIST_REQUEST});
        const {data}= await axios.get("/api/products");
        dispatch({type:PRODUCT_LIST_SUCCESS,payload:data});
    }
    catch(error){
        dispatch({type:PRODUCT_LIST_FAIL,payload:error.message});
    }
    }
    const detailsProduct=(productId)=>async(dispatch)=>{
        try {
            dispatch({type:PRODUCT_DETAILS_REQUEST,payload:productId});
            const{data} =await axios.get("/api/products/"+productId);
            dispatch({type:PRODUCT_DETAILS_SUCCESS,payload:data});
        } catch (error) {
            dispatch({type:PRODUCT_DETAILS_FAIL,payload:error.message});
        }
    }
    
    
    export default{listProducts,detailsProduct};

productReducer:

import { PRODUCT_LIST_FAIL, PRODUCT_LIST_REQUEST, PRODUCT_LIST_SUCCESS } from "../constants/productConstants";

function productListReducer(state= {products:[]},action){

    switch(action.type){
        case PRODUCT_LIST_REQUEST:
            return{loading:true};
        case PRODUCT_LIST_SUCCESS:
            return{loading:false, products:action.payload};
        case PRODUCT_LIST_FAIL:
            return{loading:false,error:action.payload};
         default:
            return state;
    }
}

export {productListReducer}
about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

You are not exporting the named constants from productReducer file that you are trying to import in your first file. Just do a named export from productReducer.

import { PRODUCT_LIST_FAIL, PRODUCT_LIST_REQUEST, PRODUCT_LIST_SUCCESS } from "../constants/productConstants";
//^^ avoid this import if not using anywhere in the file
function productListReducer(state= {products:[]},action){

    switch(action.type){
        case PRODUCT_LIST_REQUEST:
            return{loading:true};
        case PRODUCT_LIST_SUCCESS:
            return{loading:false, products:action.payload};
        case PRODUCT_LIST_FAIL:
            return{loading:false,error:action.payload};
         default:
            return state;
    }
}

export productListReducer
export const PRODUCT_LIST_FAIL = 'YOUR VALUE HERE'
export const PRODUCT_LIST_REQUEST = 'YOUR VALUE HERE'
export const PRODUCT_LIST_SUCCESS = 'YOUR VALUE HERE'

But this might cause name clashes as you are importing constants with similar names in productReducer, so it's better to avoid the import if you are not using anywhere else in productReducer because the scope of the constants is localized within the reducer function's switch case.

about 4 years ago · Juan Pablo Isaza Denunciar

0

In your code you are trying have imported constants from reducer file but you have not exported them from that file. Also you have imported same constants in reducer file also. I think you are confused about import and export. So try this:

You should have declare all of that constants in ** productConstants** file like this: productConstants.js

export const PRODUCT_DETAILS_FAIL = 'PRODUCT_DETAILS_FAIL';
export const PRODUCT_DETAILS_REQUEST = 'PRODUCT_DETAILS_REQUEST';
export const PRODUCT_DETAILS_SUCCESS = 'PRODUCT_DETAILS_SUCCESS';

export const PRODUCT_LIST_FAIL = 'PRODUCT_LIST_FAIL';
export const PRODUCT_LIST_REQUEST = 'PRODUCT_LIST_REQUEST';
export const PRODUCT_LIST_SUCCESS = 'PRODUCT_LIST_SUCCESS';

Now, import these constants in your both file reducer file and action file like this:

your action file:

import axios from "axios";
import {
  PRODUCT_DETAILS_FAIL,
  PRODUCT_DETAILS_REQUEST,
  PRODUCT_DETAILS_SUCCESS,
  // import these also from same file
  PRODUCT_LIST_FAIL,
  PRODUCT_LIST_REQUEST,
  PRODUCT_LIST_SUCCESS,
} from "../constants/productConstants";

const listProducts = () => async (dispatch) => {
  try {
    dispatch({ type: PRODUCT_LIST_REQUEST });
    const { data } = await axios.get("/api/products");
    dispatch({ type: PRODUCT_LIST_SUCCESS, payload: data });
  } catch (error) {
    dispatch({ type: PRODUCT_LIST_FAIL, payload: error.message });
  }
};
const detailsProduct = (productId) => async (dispatch) => {
  try {
    dispatch({ type: PRODUCT_DETAILS_REQUEST, payload: productId });
    const { data } = await axios.get("/api/products/" + productId);
    dispatch({ type: PRODUCT_DETAILS_SUCCESS, payload: data });
  } catch (error) {
    dispatch({ type: PRODUCT_DETAILS_FAIL, payload: error.message });
  }
};

export default { listProducts, detailsProduct };

React redux should have a proper file to implement the job easily. I have created here React Native Redux Skeleton. Check this for the initial file stucture.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda