很多人会遇到 H5 点击input 安卓端会把底部tab样式弹上去如何解决这个问题 特别是安卓端会经常遇到
但是网上又没有特别完美的方法
我这里自己弄了一个解决方案
导入main.js
通过actions 异步触发同步 mutations
注意这里 actions和mutations都是方法
所以名字要不一样
getters 是计算属性 computed
因为有些参数拿到后可能需要加减乘除等复杂计算
通过getters定义一个属性 返回值
拿到state里面的某个值进行处理 return 返回
这个属性值可以和state里面的属性名一样
因为有很多方法属性是重复的所以我们可以用到mixins
import 导入辅助函数
mapGetters Actions 是在mixins.js 最外面
这里的mounted console 打印是否混入成功
computed 混入属性hidshow
下面也是如此 …mapActions[‘xx’]
混入方法之后就直接可以使用this.xx 并且可以传入参数给Vuex
其中辅助函数引入的东西还可以取别名 直接使用
使用的时候 直接混入
然后blur focus方法用上
blur失去焦点 focus焦点
监听input 焦点的变化 渲染tab
然后在tab页面的控制页 使用getters里面的值 进行判断控制 tab的显示
产生 components的原因就是 使用了vuex 但是
vue和vue-router的版本不匹配
卸载node-modules之后重新安装回来就可以了
可能有版本冲突问题
事件委托进行美化
重点blur方法就是focusout focus方法就是focusin 在这里
封装在mixins 就可以动态控制按钮的显示了
只需要给每一个input 添加上一个class=“input”
如果觉得可以的话 帮你解决了的话 点赞三连 多分享 么么哒