要创建一个卖东西的小程序,首先要有一个安全可靠的网站架构,可以用HTML、CSS、JavaScript和其他编程语言来构建。其次,还需要一个安全的支付系统,可以使用支付宝、微信支付等第三方支付服务。最后,还要有一个友好的用户界面,能够让用户方便地购买商品,查看购物车,结账等功能。
拓展:此外,为了确保交易安全,还可以添加SSL证书,以加密用户的隐私数据,提高安全性。另外,还可以实现售后服务,让客户可以及时获得售后服务,增强用户体验。
1、将要买的物品添加到购物车。
2、勾选所有商品,点击商品合并付进行付款即可。快团团是拼多多旗下的一个团购平台,是拼多多旗下微信社群团购小程序,助力微信生态内商家经营私域流量,致力于提供“找货-找人-把货/服务卖给人”的全链路解决方法,为商家的用户们提供优质社群购物体验。
往左边滑动出现删除按钮, 只对当前滑动的对象 *** 作
<view class="shop-list">
<view class="check-all-box" bindtap="onCheckAll">
<view>
<label class="check-around8" bindtap="selected" data-lor='1'>
<radio checked="{{allSelectedtrue:false}}" color="#000"></radio>
<text class="check-all">{{checkAllText}}全选</text>
</label>
</view>
</view>
<view class="item-box {{itemisTouchMove 'touch-move-active' : ''}}" data-index="{{index}}" bindtouchstart="touchstart" bindtouchmove="touchmove" wx:for="{{list}}" wx:key="{{index}}">
<view class="item">
<view class="check-around-box" data-id="{{itemid}}" >
<label bindtap="selected" data-id="{{itemid}}" data-isSelect="{{itemisSelect}}">
<radio checked="{{itemisSelect>0true:false}}" color="#000"></radio>
</label>
</view>
<view class="item-img-box">
<image class="item-img" src="{{itemthumbUrl}}" />
</view>
<view class="item-info-box">
<text class="item-title">{{itemtitle}}</text>
<text class="item-spec">{{itemspec}}</text>
<text class="item-price">¥{{itemprice}}</text>
<view class="num-box">
<view class="num-desc" data-id="{{itemid}}" data-total="{{itemtotal}}" bindtap="reduce">-</view>
<input class="item-input" type="number"disabled="boolean" value="{{itemtotal}}" />
<view class="num-plus" data-id="{{itemid}}" data-total="{{itemtotal}}" bindtap="plus">+</view>
</view>
</view>
</view>
<view class="remove" data-id="{{itemid}}" bindtap="remove">{{remove}}删除</view>
</view>
</view>
page{
background-color: #f8f8f8;
}
shop-list {
display: flex;
flex-direction: column;
margin-top: 30rpx;
padding-bottom:120rpx;
}
check-all-box {
display: flex;
align-items: center;
padding: 30rpx;
background-color: #fff;
}
check-all-box check-all {
margin-left: 20rpx;
font-size: 30rpx;
}
check-around {
width: 35rpx;
height: 35rpx;
margin-right:20rpx;
border-radius: 50rpx;
border: 1rpx solid #f8f8f8;
}
check-active {
width: 35rpx;
height: 35rpx;
border-radius: 50rpx;
background-color: #999999;
}
item-box {
margin-bottom: 20rpx;
position: relative;
z-index: 99;
font-size: 14px;
display: flex;
justify-content: space-between;
border-bottom:1px solid #ccc;
width: 100%;
overflow: hidden
}
item {
display: flex;
align-items: center;
padding: 30rpx;
background-color: #fff;
position: relative;
z-index: 99;
width: 100%;
margin-right:0;
-webkit-transition: all 04s;
transition: all 04s;
-webkit-transform: translateX(90px);
transform: translateX(90px);
margin-left: -90px
}
item item-img {
width: 180rpx;
height: 180rpx;
border-radius: 5rpx;
border: 1rpx solid #eaeaea;
}
item item-info-box {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 420rpx;
height: 180rpx;
margin-left:20rpx;
}
item-info-box item-title {
font-size: 30rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
item-info-box item-spec {
color: #676767;
margin-top: 15rpx;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
item-info-box item-price {
display: flex;
margin-top: 15rpx;
}
item-info-box num-box {
display: flex;
align-items: center;
justify-content: flex-end;
font-size: 30rpx;
}
num-box num-desc {
padding: 0 10rpx;
color: #999;
border: 4rpx solid #999;
}
num-box item-input {
width: 80rpx;
}
item-input {
text-align: center;
}
num-box num-plus {
padding: 0 10rpx;
color: #fff;
background-color: #000;
border: 4rpx solid #000;
}
remove {
background-color: orangered;
width: 90px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #fff;
-webkit-transform: translateX(90px);
transform: translateX(90px);
-webkit-transition: all 04s;
transition: all 04s;
}
touch-move-active item,
touch-move-active remove {
-webkit-transform: translateX(0);
transform: translateX(0);
}
var app = getApp()
Page({
data: {
list: [
{
id: '1',
thumbUrl: '>
以上就是关于卖东西的小程序是怎么弄的全部的内容,包括:卖东西的小程序是怎么弄的、快团团购物车怎么合并付款、微信小程序购物车 滑动删除效果等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)