const{createApp}=Vue const{createVuetify,useGoTo,useDisplay}=Vuetify var data={alert:{show:false,color:'success',text:'',timeout:0,},theme:{dark:false,},nav:{showDrawer:false,showTOC:true,tocPanel:0,tab:'account',post:{discussionId:8250,currentPage:1,targetPage:1,total:13,anchor:0,goToOptions:{container:null,duration:0,easing:'easeInOutCubic',offset:-100,},worker:null,task:[],active:[],apiLock:[],originLike:new Map([]),},related:{block:1,}},search:{width:80,text:null,loading:false,},tags:[{id:27,url:'/t/0e2e58346a045c7567770b2b3120',name:'Go',color:'#FFA726',icon:'mdi-language-go',},],posts:[{id:106877,num:0,uid:9835,content:'\u003Cp\u003E大佬们平时都是怎样调试查看变量变化的？\u003C/p\u003E\u003Cp\u003E调试时候总是 print 会被其他打印的信息埋没，请教大佬们 有没有可以实时输出到网页的库或者工具？最好是还能记录变量变化。expvar 有些简陋了。\u003C/p\u003E',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 18:26:54',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106878,num:1,uid:869,content:'打日志可以加点锚点，看日志时通过锚点过滤\u003Cbr\u003E如果有上 elk 之类的日志系统，本身就支持过滤',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 18:51:43',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106879,num:2,uid:17330,content:'之前搞过很多花里胡哨的，最后还是返璞归真，print 大法好',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 19:00:44',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106880,num:3,uid:9835,content:'print 太多找起来有点费劲，而且 print 不能是动态的',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 19:10:28',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106881,num:4,uid:11955,content:'原来搞花里胡哨的断点什么的，最后还是 print 大法好。\u003Cbr\u003E\u003Cbr\u003E太多找起来费劲就封装个方法，搞个分组筛选就行了。类似 android 的 Logcat ，挺清晰的。',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 19:45:39',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106882,num:5,uid:16748,content:'直接 panic',ipRegion:'',updatedByUid:0,createdAt:'2025-04-11 22:37:05',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106883,num:6,uid:4265,content:'根本不调试，直接看错误日志，一般直接就知道错误原因了。如果是空指针的话，再看看错误堆栈就差不多了。',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 07:05:31',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106884,num:7,uid:4265,content:'正确输出日志，是程序员的一项基础能力。从日志输出这个维度看，10 个程序员里至少有 8 个是不合格的。',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 07:09:30',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106885,num:8,uid:14847,content:'通常用 d**ecgh/go-spew 一梭子解决😂',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 11:37:22',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106886,num:9,uid:9835,content:'没找到方便好用的库，还是老老实实 log fmt 吧',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 14:52:45',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106887,num:10,uid:2279,content:'感觉现在用这种方式调试的不多了。推荐看看 https://blog.codingnow.com/2018/05/ineffective_debugger.html',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 14:59:41',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106888,num:11,uid:10763,content:'为什么要用 print 啊？用 zerolog 等日志库啊，方便变更输出格式，输出的目标。还能根据日志等级进行筛选',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 16:27:00',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},{id:106889,num:12,uid:13229,content:'直接打日志，开发模式下会输出到 console 里，线上环境输出到日志文件里，还可以通过 配置文件来控制打印不同的日志级别\u003Cbr\u003E\u003Cbr\u003E有时也会配合使用 fmt.Println 来 debug',ipRegion:'',updatedByUid:0,createdAt:'2025-04-12 17:52:09',updatedAt:'2025-04-14 15:36:05',mentionNum:0,mentionedBy:[],mentionUsers:[],likeUsers:[],},],usersMap:new Map([[14847,{uid:14847,url:'/u/2e3f56356a045d73686e516f0f071f0f',avatar:'/a/2e3f56356a045d73686e516f0f071f0f',username:'ysicing🤖',}],[869,{uid:869,url:'/u/0a0b593f6a045c77686c5f6f26333d26',avatar:'/a/0a0b593f6a045c77686c5f6f26333d26',username:'hwdq0012🤖',}],[2279,{uid:2279,url:'/u/28315f3c6a045c75626d5f6f1e3e3a06',avatar:'/a/28315f3c6a045c75626d5f6f1e3e3a06',username:'pike0002🤖',}],[17330,{uid:17330,url:'/u/3279553d6a045d706369566f0f0f0932',avatar:'/a/3279553d6a045d706369566f0f0f0932',username:'doraemonki🤖',}],[11955,{uid:11955,url:'/u/12395f216a045d76696f536f072c2570',avatar:'/a/12395f216a045d76696f536f072c2570',username:'lscho🤖',}],[4265,{uid:4265,url:'/u/6e2b7f3b6a045c73626c536f101b3700',avatar:'/a/6e2b7f3b6a045c73626c536f101b3700',username:'xuanbg🤖',}],[9835,{uid:9835,url:'/u/23215a0b6a045c7e6869536f1d3e6a35',avatar:'/a/23215a0b6a045c7e6869536f1d3e6a35',username:'raw0xff🤖',}],[13229,{uid:13229,url:'/u/6e3362036a045d7462685f6f4f01062a',avatar:'/a/6e3362036a045d7462685f6f4f01062a',username:'qloog🤖',}],[16748,{uid:16748,url:'/u/163d5a046a045d71676e5e6f3d022333',avatar:'/a/163d5a046a045d71676e5e6f3d022333',username:'quqiu🤖',}],[10763,{uid:10763,url:'/u/6e2b68256a045d77676c556f2621033f',avatar:'/a/6e2b68256a045d77676c556f2621033f',username:'neoblackcap🤖',}],]),related:[{title:'Cursor Go 开发，有哪些必装的插件？',url:'/d/337a733f6a045c77606a56754f5b6b6a39061e13',},{title:'在 Go 项目里，涉及到金额计算，大家一般用什么方式？',url:'/d/30267d146a045c77606a5675425d606a3f732227',},{title:'[全职]广州 - 潮汐 App - Golang 开发工程师',url:'/d/022a75356a045c77606a5675445d666a3b301504',},{title:'goland 如何远程开发?',url:'/d/1e1845056a045c77606a56754550676a29726b65',},{title:'开发了一个开箱即用的本地终端 Ztty',url:'/d/0c045a2e6a045c77606a5675455e6b6a3e200734',},{title:'go 部署到 1panel 上,是用源码运行 还是编译二进制运行!',url:'/d/193a435c6a045c77606a5675455c626a38360005',},{title:'[go 分布式定时任务框架] xxljob',url:'/d/357904216a045c77606a5675475f636a041a1663',},{title:'关于 Go 并发获取数据的问题，请教大家',url:'/d/687d67226a045c77606a5674415b646a1d3a3138',},{title:'macOS Goland 经常在双击 shift 全局搜索的时候，出现彩虹球，只能强制退出',url:'/d/380f58206a045c77606a5674435b666a15111c2a',},{title:'今天有个面试官和我讲 go 的协程比系统的线程更慢，这个我不能理解',url:'/d/182459046a045c77606a56744359626a1412041a',},{title:'Java 和 go 都会，以后找工作偏向哪个方面好呢',url:'/d/000b7b1b6a045c77606a5674445e656a1977262a',},{title:'作为一个传统开发者，如何使用 ai 或者机器学习实现一些简单事情',url:'/d/34015f186a045c77606a5674445e626a25016611',},{title:'大家 golang 项目里目前在用哪个 log 库打印日志呢？',url:'/d/623a67086a045c77606a5674455c646a5d0c1f65',},{title:'朋友们，有哪些基于 Gin 框架的优秀开源项目，用来学习？',url:'/d/28116a596a045c77606a5674455d656a3c326135',},{title:'新手提问， Go 作为一个 GC 语言，为什么要设计成带指针类型的呢？',url:'/d/12067f176a045c77606a5674455b626a072a2734',},{title:'做个调研， go 语言，大家在用哪个 http 请求库？',url:'/d/337155556a045c77606a5674475a646a262a0b10',},{title:'[golang] 后端开发工程师|海外电商 AI+ SaaS 招长期远程兼职/全职',url:'/d/1d277d2a6a045c77606a5677425b616a1a211a39',},{title:'仓颉编程语言的这个反序列化和序列化比 go 复杂好多',url:'/d/361d472b6a045c77606a567745506b6a5a1a6160',},{title:'作为 Java 狗的我，学习 rust 的时候为啥总念着 go 的好呢？',url:'/d/6f2a02176a045c77606a5671435d636a2f121465',},{title:'原 Java 刚学习 go, 自己在写项目, 针对 go 日志方面的疑惑',url:'/d/6b2c02596a045c77606a56714359626a0f361626',},],} const App={setup(){const goTo=useGoTo() const{mdAndUp}=useDisplay() return{goTo,mdAndUp}},data(){return data;},mounted(){const themeDark=localStorage.getItem("themeDark") if(themeDark!==null){this.theme.dark=JSON.parse(themeDark)} if(this.nav.post.total>(this.nav.post.currentPage-1)*100+20){let moreLen=100 if(this.nav.post.total({id:null,num:(this.nav.post.currentPage-1)*100+v,uid:null,content:null,ipRegion:null,updatedByUid:null,createdAt:null,updatedAt:null,mentionNum:null,mentionedBy:null,mentionUsers:null,likeUsers:null,})) this.posts.push(...morePosts.slice(20))} this.workerStart() const hash=window.location.hash const match=hash.match(/#(\d+)/) if(match){const n=parseInt(match[1],10) if(n>=(this.nav.post.currentPage-1)*100&&n{this.jumpTo(n)})}} this.$nextTick(()=>{this.addHeadingIds() tocbot.init({tocSelector:'.toc',contentSelector:'#post-content-0',headingSelector:'h2, h3, h4',headingsOffset:100,scrollSmoothOffset:-100,scrollSmooth:true,collapseDepth:6,onClick:function(e){setTimeout(()=>{history.replaceState(null,'',window.location.pathname+window.location.search)},0)},}) tocbot.refresh()});},beforeUnmount(){this.workerStop() if(this.quill){this.quill.destroy() this.quill=null}},computed:{dposts(){return this.posts.slice(20);},},created(){},methods:{successAlert(msg){this.alert={show:true,color:'success',text:msg,timeout:1500,}},failureAlert(msg){this.alert={show:true,color:'error',text:msg,timeout:5000,}},flipThemeDark(){this.theme.dark=!this.theme.dark localStorage.setItem("themeDark",JSON.stringify(this.theme.dark))},toSearch(){if(!this.search.text){this.failureAlert('搜索词不能为空') return} let keywords=this.search.text.trim() if(keywords.length<1){this.failureAlert('搜索词不能为空') return} if(keywords.length>100){this.failureAlert('搜索词过长') return} this.doSearch(keywords)},toReg(){window.location.href="/reg"},toLogin(){window.location.href="/login"},toPage(){let url=window.location.href url=url.replace(/(\/\d+)?(#[0-9]+)?$/,this.nav.post.targetPage>1?`/${this.nav.post.targetPage}`:'') window.location.href=url},toLoadRelated({done}){if(this.my&&this.my.uid){this.apiLoadRelated({done})}else{done('ok')}},workerStart(){this.nav.post.worker=setInterval(()=>{this.workerLoad()},500);},workerStop(){if(this.nav.post.worker){clearInterval(this.nav.post.worker);this.nav.post.worker=null;}},async jumpTo(num){const page=Math.floor(num/100)+1 const i=num-(page-1)*100 if(page===this.nav.post.currentPage){this.goTo("#post-"+num,this.nav.post.goToOptions) if(!this.posts[i].id){const block=Math.floor(num/20)+1 this.nav.post.apiLock[block]=true await this.apiLoadPosts(block) this.$nextTick(()=>{this.goTo("#post-"+num,this.nav.post.goToOptions)})}}else{let url=window.location.href url=url.replace(/(\/\d+)?(#[0-9]+)?$/,page>1?`/${page}`:'') url=url+"#"+num window.location.href=url}},postIntersect(num){return(isIntersecting,entries,observer)=>{if(isIntersecting){this.nav.post.task.push(num) this.nav.post.active.push(num) this.nav.post.active=this.nav.post.active.filter(item=>Math.abs(item-num)<=5) this.nav.post.active.sort((a,b)=>a-b)}else{this.nav.post.active=this.nav.post.active.filter(item=>item!==num)} if(this.nav.post.active[0]){this.nav.post.anchor=this.nav.post.active[0]}else{this.nav.post.anchor=0}}},async apiLoadPosts(block){try{const response=await axios.post('/fapi/v1/post/block/'+block,{discussionId:this.nav.post.discussionId,}) if(response.data.code===0){response.data.data.posts.forEach(post=>{const i=post.num%100 Object.assign(this.posts[i],post)}) response.data.data.users.forEach(user=>{this.usersMap.set(user.uid,user)})}else{this.failureAlert('回帖数据加载失败: '+response.data.msg)}}catch(error){this.failureAlert('回帖数据加载失败: '+error)} this.nav.post.apiLock[block]=false},workerLoad(){while(this.nav.post.task.length){const num=this.nav.post.task.pop() const i=num-(this.nav.post.currentPage-1)*100 if(!this.posts[i].id){const block=Math.floor(num/20)+1 if(!this.nav.post.apiLock[block]){this.nav.post.apiLock[block]=true this.apiLoadPosts(block)}}}},getTimeInfo(t){if(!t){return ""} const now=new Date();const then=new Date(t);const diff=now-then;const minute=60*1000;const hour=minute*60;const day=hour*24;const month=day*30;const year=month*12;if(diffpost.num===num) if(!post){return "#"+num} const uid=post.uid const username=this.usersMap.get(uid)?.username if(!username){return "#"+num} return username},getUsernameByPostId(id){const post=this.posts.find(post=>post.id===id) if(!post){return "#"+this.getPostNumByPostId(id)} const uid=post.uid const username=this.usersMap.get(uid).username if(!username){return "#"+this.getPostNumByPostId(id)} return username},getPostNumByPostId(id){const post=this.posts.find(post=>post.id===id) return post.num},getPostById(id){const post=this.posts.find(post=>post.id===id) return post},getPostByNum(num){const post=this.posts.find(post=>post.num===num) return post},getAvatarByUid(uid){const avatar=this.usersMap.get(uid)?.avatar if(!avatar){return this.getRandomAvatar()} return avatar},getAvatarByPostNum(num){const post=this.posts.find(post=>post.num===num) if(!post){return this.getRandomAvatar()} const uid=post.uid return this.getAvatarByUid(uid)},getRandomAvatar(){const num=Math.floor(Math.random()*100) return "https://randomuser.me/api/portraits/men/"+num+".jpg"},getUrlByUid(uid){const url=this.usersMap.get(uid)?.url if(!url){return ""} return url},getTextByPostNum(num){const post=this.posts.find(post=>post.num===num) if(!post||!post.content){return '点击跳转到#'+num+'查看'} const parser=new DOMParser() const doc=parser.parseFromString(post.content,'text/html') const text=doc.body.textContent||'' return text.slice(0,100)},addHeadingIds(){const content=document.getElementById('post-content-0') if(!content){this.nav.showTOC=false return} const headings=content.querySelectorAll('h2, h3, h4') headings.forEach((heading,index)=>{if(!heading.id){heading.id=`toc-nav-${index}`}}) if(headings.length==0){this.nav.showTOC=false}},async doSearch(keywords){this.search.loading=true try{const response=await axios.post('/fapi/v1/search',{keywords:keywords,}) if(response.data.code===0){if(response.data.data.hash&&response.data.data.hash.length===32){window.location.href="/s/"+response.data.data.hash}else{this.failureAlert('搜索失败: 搜索服务异常')}}else{this.failureAlert('搜索失败: '+response.data.msg)}}catch(error){this.failureAlert('搜索失败: '+error)} this.search.loading=false},debounce(fn,delay){let timer=null return function(...args){if(timer)clearTimeout(timer) timer=setTimeout(()=>{fn.apply(this,args)},delay);};},},watch:{'nav.post.targetPage':{handler:async function(newV,oldV){this.toPage()},immediate:false},},} const vuetify=createVuetify({defaults:{global:{ripple:true,},},}) const app=createApp(App) app.use(vuetify).mount("#app")