很多人會遇到 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”
如果覺得可以的話 幫你解決了的話 點贊三連 多分享 么么噠
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/229872.html
標籤：其他
上一篇：CSS特效八：開關按鈕