Reactjs - 如何在Stripe结帐表单中使用redux

loading...


0

我在我的项目中使用react条纹 . 我按照教程https://stripe.com/docs/recipes/elements-react .

如文档中所述,表单导出如下 .

export default injectStripe(Form)

在文档中,api调用如下所示 .

async submit(ev) {
  let {token} = await this.props.stripe.createToken({name: "Name"});
  let response = await fetch("/charge", {
    method: "POST",
    headers: {"Content-Type": "text/plain"},
    body: token.id
  });

  if (response.ok) console.log("Purchase Complete!")
}

但我需要连接redux来进行提交api调用 .

checkoutActions.js

import * as types from '../constants/actionTypes';
export function checkout(obj) {
  const api = types.API_URL_CHECKOUT;
  return dispatch => {
    return dispatch({
      type: types.ACTION_CHECKOUT,
      promise: client => client.post(api, obj).then((data) => {
        return data;
      }),
    });
  };
}

所以我修改了表单导出如下 .

export default connect(state => ({
  ...state.resp
}),{
  ...checkoutActions
})injectStripe(Form)

但它正在返回错误

解析错误:意外的令牌,预期“;”

关于如何在条纹结账表单中连接redux的任何想法?

loading...

1回答

  • 0

    您在injectStripe上缺少括号 .

    export default connect(state => ({...state.resp}),{...checkoutActions })(injectStripe(Form))
    
评论

暂时没有评论!