ウィジェットキーボードカバー入力ボックス

1649 ワード
使用するvanコンポーネント、返信ボックスは下からポップアップして、箱の高さを設定することができて、位置決めを設定することができて、直接箱の高さを設定するならば、2行のcssコードを節約することができます

    
      
      

        
        {newBox = value.mp.detail.value}" 
          :value="newBox"
          :adjust-position="false"
          @focus="areaFocus"
          @blur="areaBlur"
        >
        
{{replyOrAddKeyWord}}

js 
areaBottom: 60 // data ，areaBottom    60，     

areaFocus (e) { // input     ， addBoxBox    
  if (this.isX) { //      iPhoneX，         ，  20px   
    this.areaBottom = e.detail.height + 40 //      +addBoxBox   
  } else {
    this.areaBottom = e.detail.height + 60
  }
},
areaBlur () {
  this.areaBottom = 60  //      ， input  
},

css 

.addBoxBox
  width 375px
  padding 12.5px
  background #fff
  box-sizing border-box
  display flex
  justify-content space-between
  input
    width 277px
    height 35px
    background #F4F5FA
    padding 10px 9px
    box-sizing border-box
    font-size 14px
    line-height 15px
    color #252525
    resize none
  div
    width 55px
    height 35px
    border-radius 2px
    background #2361FF
    font-size 13px
    color #ffffff
    line-height 35px
    text-align center
laravel ログファイルのpermission denied 対処
dllとプログラム間のデータ共有(#pragma data_seg()