手动控制console.log开关

本文介绍了一种在手机浏览器中查看console.log信息的小技巧,并提供了一个简单的JavaScript代码片段,该片段可以实现在特定条件下显示或隐藏console.log消息的功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

手机端查看console.log
网上有很多插件,在页面中引用就可以

小技巧:当页面url 有eruda=true参数时,开启

(function () {
   var src = 'https://cdn.bootcss.com/eruda/1.5.4/eruda.min.js'
   if (!/eruda=true/.test(window.location) && localStorage.getItem('active-eruda') != 'true') return
   document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>')
   document.write('<scr' + 'ipt>eruda.init();</scr' + 'ipt>')
 })()

pc 页面不想他人看见console.log 消息,但是必要时候又需要打开调试

小技巧:当页面有console=true参数时,才能看到consle.log 的内容

if (!/console=true/.test(window.location)) {
  console.log = () => {}
}
<template> <view class="container"> <view class="content"> <u-form :model="form" ref="form" :rules="rules" label-width="150"> <!-- 购课来源(选择器形式) --> <u-form-item label="购课来源" prop="sourceId" required> <view class="custom-select" @click="showSourcePicker = true"> <text class="select-text" :class="{placeholder: !form.sourceLabel}"> {{ form.sourceLabel || '请选择购课来源' }} </text> <u-icon name="arrow-down" color="#999" size="28"></u-icon> </view> <u-picker :show="showSourcePicker" :columns="[sourceOptions]" keyName="sourceName" @confirm="onSourceConfirm" @cancel="showSourcePicker = false;"> </u-picker> </u-form-item> <!-- 套餐选择 --> <u-form-item v-if="packageOptions.length > 0" label="课程套餐" prop="courseMenuId" required> <view class="package-list"> <view class="package-item" v-for="item in packageOptions" :key="item.id" :class="{'package-item-active': form.courseMenuId === item.id}" @click="form.courseMenuId = item.id"> <view class="package-name">{{item.name}}</view> <view class="package-price">¥{{item.money}}</view> <view class="package-count">私教:{{item.personaltainerTimes}}节</view> <view class="package-count">小班:{{item.publicTimes}}节</view> <view class="package-count">有效天数:{{item.publicTimes}}</view> <u-icon v-if="form.courseMenuId === item.id" name="checkbox-mark" color="#7FB8A1" size="24" class="package-check"></u-icon> </view> </view> </u-form-item> <!-- 定金开关 --> <u-form-item label="定金订单" prop="isEarnest"> <u-switch v-model="form.isEarnest" activeValue="1" inactiveValue="0" active-color="#7FB8A1"></u-switch> </u-form-item> </u-form> <!-- 提交按钮 --> <view class="submit-btn"> <u-button type="primary" shape="circle" @click="submitForm" :custom-style="buttonStyle"> 提交 </u-button> </view> </view> </view> </template> <script> import { buySourceInfo, courseMenuInfoDic, sale } from "@/api/purchase-course.js" export default { data() { return { navbarBackground: { backgroundColor: '#7FB8A1' }, buttonStyle: { backgroundColor: '#7FB8A1', color: '#FFFFFF', border: 'none' }, showSourcePicker: false, form: { sourceId: '', sourceLabel: '', courseMenuId: '', isEarnest: false, qrCode: '' }, sourceOptions: [], packageOptions: [], rules: { sourceId: [{ required: true, message: '请选择购课来源', trigger: 'change' }], courseMenuId: [{ required: true, message: '请选择课程套餐', trigger: 'change' }] } }; }, onLoad(option) { console.log(option); this.form.qrCode = option.result }, onReady() { // this.$refs.uForm.setRules(this.rules); }, mounted() { this.getBuySourceInfo() }, methods: { // 获取购课来源 getBuySourceInfo() { buySourceInfo().then((res) => { if (res.code == 200) { this.sourceOptions = res.data } }) }, // 选择购课来源 onSourceConfirm(e) { console.log(e); this.form.sourceId = e.value[0].id this.form.sourceLabel = e.value[0].sourceName this.getCourseMenuInfoDic(this.form.sourceId) this.showSourcePicker = false; }, // 获取课程套餐 getCourseMenuInfoDic(sourceId) { courseMenuInfoDic(sourceId).then((res) => { if (res.code == 200) { this.packageOptions = res.data } }) }, // 提交售课 submitForm() { console.log('开始提交表单'); this.$refs.form.validate(valid => { if (valid) { const { sourceLabel, ...buyRecordAdd } = this.form sale(buyRecordAdd).then((res) => { if (res.code == 200) { setTimeout(() => { uni.showToast({ title: '提交成功', icon: 'success' }); console.log('表单数据:', buyRecordAdd); }, 1500); } }) } else { uni.showToast({ title: '请填写完整信息', icon: 'none' }); } }) } } }; </script> <style lang="scss" scoped> .container { background-color: #f8f8f8; min-height: 100vh; } .content { padding: 20rpx 30rpx; } .custom-select { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; background-color: #fff; border: 1px solid #eee; border-radius: 8rpx; .select-text { font-size: 28rpx; color: #333; &.placeholder { color: #999; } } } .package-list { display: flex; flex-wrap: wrap; margin: -10rpx; } .package-item { width: 100%; margin: 10rpx; padding: 20rpx; background-color: #fff; border-radius: 12rpx; position: relative; border: 1px solid #eee; &-active { border-color: #7FB8A1; background-color: rgba(127, 184, 161, 0.05); } } .package-name { font-size: 28rpx; font-weight: bold; margin-bottom: 10rpx; color: #333; } .package-price { font-size: 32rpx; color: #7FB8A1; font-weight: bold; margin-bottom: 5rpx; } .package-count { font-size: 24rpx; color: #999; } .package-check { position: absolute; right: 10rpx; top: 10rpx; } .submit-btn { margin: 40rpx 0; } </style>点击submitForm没反应
最新发布
07-24
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值