思考-为何在每一个接口加catch

介绍

哈喽！大家好！我是贼漂亮！！本次分享个小玩意～一点不枯燥

背景：

其实本次文章不是一个技术上的文章，可以说是我接触前端以来的第一次思考。哈哈哈哈哈！！
以前其实只是就写上去，但是我也不知道为啥要写上去，以前看的书啥的也没告诉我为啥要写上去，反正就是写上去就对了。但是因为最近一次有一次的新页面开发，以及读完Dont make me think那本书，导致我对catch以及各种提示，有了一个新的理解。

看下面这个图：
这是一个弹窗，当输入id的时候，点击提交，这个弹窗会关闭。over（输入后，下次弹出，上次的id还在哦）

（PS：其实当我刚看到这个页面的时候 我被这两个紧紧挨着的盒子搞得我很难受）回归正题，当我啥也没输入的时候，这时我点击了提交按钮，but！杂啥反应也没有呢？这是好使了？不好使？回想我在做跟这个相关的一个需求时，一个比较老的产品告诉我需要输入id，在清除掉以前的id才会生效。
此时我如下图：

但是毕竟自己来没多久，您时间长，您肯定更了解，您说的算，so 我按他说的试了试～哈哈哈哈哈！！！
直到后来，我优化这个项目的这个部分。
你说点击它为啥没反应，你输入id，点击提交，弹窗是关闭了，那然后呢？？你告诉我下好不嘞，告诉我成功没成功，你这让我思考了啊！！

你看当我点完提交之后，你告诉我下多好！我一下子就知道我成功了！

再来说当我啥也没输入，直接点提交的时候，你在提醒我下子（咱就把接口msg抛出去，简单粗暴）

你瞅瞅，这多一目了然。
瞅瞅代码

let param ={
     adBasicId:this.adBasicId,
     habitId:this.simulateId,
 };
 AdvertApi.simulateAd(param).then((res) => {
     this.simulateDialogVisible = false;
 })

参考公司一同事言：不行呀，这不行呀，你这不行呀！

let param ={
     adBasicId:this.adBasicId,
     habitId:this.simulateId,
 };
 AdvertApi.simulateAd(param).then((res) => {
     this.simulateDialogVisible = false;
     this.simulateId = '';
     this.$message({
         message:'模拟成功',
         type:'success'
     })
 }).catch(err => {
     this.$message.error(err.data.msg)
 })

总结：

虽然dont make me think那本书 刚看完可能没啥子感觉，但是你不得不承认，每一本书都不会说让你白读的。我觉得作为咱们前端来说，这个最基本的用户体验是必须具备的，往往在开发时候，我们自测会侧重于功能跑不跑的通，但是有时候用户体验也很重要。ok，白话的一篇文章就此结束～散会