Pi Demo App 学习笔记(前端)

Pi Network项目提供了代码开源的Pi Demo App,Pi Demo App的前端的页面显示和业务逻辑主要实现2个功能:

1)用户登录和退出

2)创建支付订单和支付订单

前端的业务逻辑主要是3个文件

1)index.tsx

文件路径 https://github.com/pi-apps/demo/blob/main/frontend/src/Shop/index.tsx

业务逻辑的入口文件

主要的函数:

a)signIn()

功能:用户登录

b)signOut()

功能:用户退出

c)orderProduct()

功能:创建支付订单

d)onIncompletePaymentFound()

功能:支付未完成处理

e)onReadyForServerApproval()

功能:同意支付处理

f)onReadyForServerCompletion()

功能:支付完成处理

g)onCancel()

功能:支付取消处理

h)onError()

功能:支付出错处理

支付流程有点复杂,这个在介绍后端时再详细介绍。下面是官方给的支付流程说明文档

https://github.com/pi-apps/pi-platform-docs/blob/master/payments.md

2)SignIn.tsx

文件路径 https://github.com/pi-apps/demo/blob/main/frontend/src/Shop/components/SignIn.tsx

用户登录和退出的业务逻辑文件

3)ProductCard.tsx

文件路径 https://github.com/pi-apps/demo/blob/main/frontend/src/Shop/components/ProductCard.tsx

创建支付订单的业务逻辑文件

我在Pi Demo App基础上开发了一个线上版的公园相亲角:派之爱,在手机上的Pi浏览器或电脑的浏览器的地址栏输入"lovepi.vip"就可以使用,具体使用方法参考公告栏。

更多区块链方面的文章,可以看我的学习笔记 :www.0101.vip

----------------------------------------------------------------------------------

我是powervip,一个热爱区块链和人工智能的程序员

我的知乎:https://www.zhihu.com/people/powervip

我的公众号:区块链战斗机

我的学习笔记:www.0101.vip

如果你觉得这篇文章写得还可以,请帮忙点个赞,谢谢!著作权归作者所有。如需转载,请注明原文出处并保留原文链接。

你的鼓励,我的动力!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值