问题描述
因此，我想使用存储在cookie中的数据来填充带条帐单和付款地址的条带结帐模式，因为希望设置默认送货和帐单地址的登录用户不必在每次购买时都填写字段。
这是我在react中的条纹结帐代码：
import React,{useState,useEffect,useContext} from 'react'
import {FlexRow,LightParagraph,Border,RawLink,Card} from '../../../Style/global'
/** @jsx jsx */
import { jsx,css } from '@emotion/core'
import {CartContext} from '../../../Context/CartProvider'
import StripeCheckout from 'react-stripe-checkout'
import axios from 'axios'
const CheckoutPayment=(props)=> {
const {method}=props
const [productsToProcces,setproductsToProcces] = useState([])
const {cart} = useContext(CartContext)
useEffect(() => {
setproductsToProcces(cart.map(item=>({ title:item.itemName,price:item.itemPrice,quantity:item.quantity,images:item.images})))
},[])
const handelToken=async(token)=>{
try {
const stripeResponse =await axios.post('http://localhost:4000/stripe/checkout',{
token,product:{
products:products.map(p=>p.title),amount:products.map(item=>item.price * item.quantity).reduce((a,b)=> a + b,0)*100
}
})
} catch (error) {
console.log(error)
}
}
return (
<div>
<Card >
<FlexRow no100={true} justify="space-between" css={css`padding:1rem;`} >
<LightParagraph size={.8} mgb={0} css={css`width:100px;`}>Contact</LightParagraph>
<LightParagraph size={.8} mgb={0}>sad_fatah@outlook.com</LightParagraph>
<RawLink to="checkout/information" >Change</RawLink>
</FlexRow>
<Border css={css`margin-bottom:0;`} />
<FlexRow no100={true} justify="space-between" css={css`padding:1rem;`} >
<LightParagraph size={.8} mgb={0} css={css`width:100px;`}>Contact</LightParagraph>
<LightParagraph size={.8} mgb={0}>ASKJALKSLASA,ASASA,4500 OUARZAZATE,Morocco</LightParagraph>
<RawLink to="checkout/information" >Change</RawLink>
</FlexRow>
<Border css={css`margin-bottom:0;`} />
<FlexRow no100={true} justify="space-between" css={css`padding:1rem;`} >
<LightParagraph size={.8} mgb={0} css={css`width:100px;`} >Method</LightParagraph>
<LightParagraph size={.8} mgb={0} >
{method || 'dhl Express '}
<span css={css`${styles.bill__total};${styles.smallMoney}`}>$100.37</span>
</LightParagraph>
<RawLink to="checkout/information" >Change</RawLink>
</FlexRow>
</Card>
<FlexRow >
<RawLink to="/checkout/information" size={1}><i className="fas fa-angle-left iconeB"></i> Return to shipping</RawLink>
<StripeCheckout
stripeKey='pk_test_51HCsVhLkAIHmcekiVfb5aSOF75ejplKwn7MhbxmQKMVtJrworoCsyNL8Otxs0cdcFYjKMpjejHzChey00DlIkW8b007nxn9KYC'
token={handelToken}
billingAddress
shippingAddress
amount={productsToProcces.map(item=>item.price * item.quantity).reduce((a,0)*100}
/>
</FlexRow>
</div>
)
}
const styles ={
smallMoney :css`
font-size: .9rem;
color: var(--colorGreyDark);
`,bill__total :css`
font-weight: 600;
`,}
export default CheckoutPayment
解决方法
无法在Stripe的旧版Checkout中预先填写帐单或送货地址。如您所见，您正在使用的库仅分别接受const Discord = require("discord.js");
const config = require("../config.json");
const mysqlconfig = require("../mysqlconfig.json");
const path = require('path');
const fs = require('fs');
const date = new Date();
const day = date.getDate();
const month = date.getMonth();
var mysql = require('mysql');
const { release } = require("os");
module.exports.run = async (bot,message,args) => {
var con = mysql.createPool({
host: mysqlconfig.host,user: mysqlconfig.user,password: mysqlconfig.password,database: mysqlconfig.database,port: 3306
});
var sql = `SELECT * FROM money WHERE userID = '${message.author.id}'`
con.query(sql,async function (err,results,userID,balance,fields,rows) {
let data = results.map(v => {
//console.log(v.userID)
if(message.author.id = v.userID) { // checks if message.author.id is equal to any id in the database
message.channel.send(`You have **${v.balance}** YeetCoins!`)
return v.balance
} else { // if not it should add the id and also add 100 coins
var sql1 = `INSERT INTO balance (userID,balance) VALUES (?,?) ON DUPLICATE KEY UPDATE userID=VALUES(userID)`
con.query(sql1,[message.author.id,'100'],function (err,result,userID) {
});
message.channel.send(`added 100 coins to <@${message.author.id}>'s balance!`)
}
})
})
}
module.exports.help = {
name: "balance",category: "User"
}
和billingAddress道具的布尔值：
https://github.com/azmenak/react-stripe-checkout/blob/master/StripeCheckout.js#L153-L159
我会考虑使用Stripe较新的Checkout产品，该产品会自动为您显示/隐藏帐单邮寄地址字段：