网站开发主要有两个阶段,wordpress 蜘蛛插件,维护官网,域客士营销型单页网站程一、首先看最终效果 先说下整体逻辑,选中状态为淡紫色,点击哪个金额,充值页面上就显示多少金额 二、代码 view classaddMoneyview classaddMoneyTittle充值金额/viewview classselfaddmoney :class{…一、首先看最终效果 先说下整体逻辑,选中状态为淡紫色,点击哪个金额,充值页面上就显示多少金额 二、代码 view classaddMoneyview classaddMoneyTittle充值金额/viewview classselfaddmoney :class{selfaddmoney1:isActive}text自定义交费/text input focusisActive true blurisActive false typetextv-modeladdmoney classselfinputtext classselfinputtext元/text/viewview classmoneyLautview classmoney v-for(item,index) in money clickaddmoneyValue(index):class{active:selectedIndex index}{{item.money}}text classselfinputtext元/text/view/view/viewdata() {return {show: false,show1: false,showOverlay: false, // 控制overlay显示与否的变量appointmentStatus: true, // 假设初始状态为预约失败 selectedOldMan: 0,selectedIndex: null, // 用于存储当前选中的元素索引 inforList: [{name: 吴海军,phon: 135 2589 3657,idNumber: 430525199401053654,identifier: 2358697454}],money: [{money: 500}, {money: 1000}, {money: 2000}, {money: 3000}, {money: 5000}, {money: 10000}, ],addmoney: 15000,isActive: false}addmoneyValue(index) {this.selectedIndex index; // 设置当前选中的索引 this.addmoney this.money[index].money;},.addMoney {margin-top: 20rpx;height: 530rpx;padding: 30rpx 20rpx 54rpx 22rpx;background: #FFFFFF;box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(0, 0, 0, 0.05);border-radius: 10rpx 10rpx 10rpx 10rpx;.money {width: 202rpx;height: 124rpx;border-radius: 10rpx 10rpx 10rpx 10rpx;border: 1rpx solid #999999;text-align: center;line-height: 124rpx;margin-bottom: 20rpx;}.selfaddmoney1 {display: flex;align-items: center;margin-top: 28rpx;margin-bottom: 36rpx;width: 650rpx;height: 76rpx;background: #F6F5FF;border-radius: 10rpx 10rpx 10rpx 10rpx;border: 2rpx solid #5448FF;text-align: center;line-height: 76rpx;padding-left: 32rpx;box-sizing: border-box;}.selfaddmoney {display: flex;align-items: center;margin-top: 28rpx;margin-bottom: 36rpx;width: 650rpx;height: 76rpx;border-radius: 10rpx 10rpx 10rpx 10rpx;border: 2rpx solid #999999;text-align: center;line-height: 76rpx;padding-left: 32rpx;box-sizing: border-box;}.selfinput {width: 400rpx;text-align: right;}.selfinputtext {font-size: 20rpx;margin-top: 8rpx;}.addMoneyTittle {font-size: 32rpx;color: #5448FF;}.moneyLaut {display: flex;justify-content: space-between;flex-wrap: wrap;}}
搞定收工