点击事件失效？ 绑不上点击事件

　　今天要给登录界面账号输入加个历史账号记录的小功能：每次登录过后记录下账号，下次登录输入账号时，点击账号input框，下弹出历史账号以供选择。

但是发现绑在历史账号标签上的点击事件不得行，感觉就像是点击事件失效了？ 或者绑不上点击事件。

　　逻辑是这样的：

　　　　　　　　1、当账号input框获取焦点时，showHisAccRec 改为 true，即渲染弹出历史账号记录。

　　　　　　　　2、当用户点击某一项历史账号时，把这项值赋值给账号input框。同时账号input框会因为点击自动失去焦点，就把showHisAccRec 改为 false，即收起历史账号记录。

　　很简单。

 

　　这是标签：

<input
    class="input-account"
    type="number"
    v-model="userId"
    placeholder-style="mine-placeholder"
    placeholder="账号/手机号"
    data-key="userId"
    @input="inputChange"
    @blur="blurChange"
    @focus="focusChange"
    :class="{ error: isError }"
/>
<input type="text" name="username" style="z-index: -1; position: absolute;" />
<view class="input-accounts-records" v-if="showHisAccRec">
    <!-- <template v-for="(account, index) in allAccountRecords.account">
            <text class="iar-account" @click="changeUserId(index)">{{account}}</text>
        </template> -->
<view class="iar-account" v-for="(account, index) in allAccountRecords.account" @click="changeUserId(index)" :key="index">{{ account }}</view>
</view>

　　这是函数：

blurChange(e) {
    const key = e.currentTarget.dataset.key;
    if (key === 'userId') {
        this.showHisAccRec = false;
    }
            
},
focusChange(e) {
    const key = e.currentTarget.dataset.key;
    if (key === 'userId') {
        this.showHisAccRec = true;
    }
},
changeUserId(index) {
    this.userId = this.allAccountRecords.account[index];
},

 

　　我以为可能的问题是： template  渲染、事件代理、层级、嵌套...，都试了试，没用，始终点击事件没反应，把我都整楞了！

　　这么简单的一个...绑定事件都搞不定了吗？

　　因为使用的是uni-app，就有点以为又是什么奇葩的坑，但是检查页面也没有什么奇异的地方，整个页面没使用啥复杂的东西，然后问了你度娘，还是没啥结果...

 

　　本来最近情绪就有点低沉，还能遇到这么个简单的问题坑我，真的是有点难受，TMD啊！...

......

　　然后找到问题了：不应该再失焦函数里面修改 showHisAccRec 状态。

　　聚焦时 showHisAccRec 改为 true ，显示历史记录，没问题，然后点击某一项记录时，问题来了：

　　　　点击的一瞬间，本来期望它先触发 changeUserId 函数，然后账号input框会因为点击自动失去焦点，然后调用  blurChange 函数 把 showHisAccRec 改为false。

　　事实是：

　　　　点击的一瞬间，账号input框就因为点击自动失去焦点，然后调用  blurChange 函数 把 showHisAccRec 改为false...

　　　　这时候视觉上好像有点击到历史记录，就引出了问题：点击事件没触发。

　　　　其实根本就没点击到！失焦太快了，点了个寂寞。

 

　　😂😂😂😂😂😂...

　　不是uni-app的问题，也和vue没关系，其实我觉得逻辑也没问题嘛！

　　总之！别在失焦里面立马修改状态就好了...

 

 

　　小问题一个，倒是把我逗笑了，编程问题有时候太奇葩了！

　　最近心态不大好，多多调整啊！加油！