reactjs - Redux returns error 'Actions must be plain objects. Use custom middleware for async actions.' even though middleware is defined -


i use redux-thunk redux async action, redux returns error: 'actions must plain objects. use custom middleware async actions.'

i not using webpack, instead of concatenating js files 1 file. aware issue may caused that, need solution without webpack, if possible.

here store definition

const pricingstore = redux.createstore(     pricingreducer,     redux.applymiddleware(window.reduxthunk.default)     // using umd redux-thunk https://npmcdn.com/redux-thunk@2.0.1/dist/redux-thunk.min.js );  const {provider} = reactredux;  $(document).ready(() => {     const pricingcontainer = document.getelementbyid('containerpricing');      if (pricingcontainer) {         parsepricingdata();         const render = () => {             reactdom.render(                 <provider store={redux.createstore(pricingreducer)}>                     <pricing />                 </provider>,                 pricingcontainer             );         };          render();         pricingstore.subscribe(render);     } }); 

here action

function uploadinvoices() {     console.log('works here');      return function () {         console.log('doesnt log msg');          return null;     }; } 

here call of action

const { connect } = reactredux;  let fileupload = ({dispatch}) => {     return (         <input type="file" name="image" multiple onchange={(e) => dispatch(uploadinvoices())} />     ); };  fileupload = connect()(fileupload); 

please me solution

actions plain javascript objects. actions must have type property indicates type of action being performed. types should typically defined string constants. once app large enough, may want move them separate module.

this redux docs. seem issue fact action returning other object.

just clarify bit more. action supposed doing nothing more return object @ minimum has type property passed reducer. if want use thunk handle async flow, should happen before action called. flow more this. call redux thunk connected component, thunk dispatches action , passes payload may need. action return object , have no logic of own.


Comments

Popular posts from this blog

commonjs - How to write a typescript definition file for a node module that exports a function? -

openid - Okta: Failed to get authorization code through API call -

thorough guide for profiling racket code -