账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue中如果对input元素通过keydown控制元素的属性变化,会出现不能输入的情况
    42
    0

    官方的回复就是属性改变会整体元素render,并不是setAttribute 看来只能自己规避, 感谢各位的回答, 给+1
    官方回复


    大概猜到了, 是不是属性的变化引起了render, vue内部render的逻辑会重新读取props上的value进行重新渲染, 所以就出现了下面的情况. 请看过的vue源码的大神给与回复确认, 3q.

    演示


    请问这是不是vue的bug?

    浏览器: mac谷歌68
    vue: 2.5.16 && 2.5.17

    复现1

    复现2

    代码:

    <div id="app">
      <input :warning="hasWarning" :value="text" @keydown="keydown" />
    </div>
    new Vue({
      el: "#app",
      data: {
        text: 'vue',
        hasWarning: false
      },
      methods: {
          keydown() {
          if (1 == 1) {
              this.hasWarning = true;
          }
          this.hasWarning = false;
        }
      }
    })
    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 10 元积分
        全部回答
    • 0
    • 五角星懵逼 普通会员 1楼

      在 Vue 中,当对输入框的keydown事件进行操作时,如果不能正常输入,可能是因为该输入框没有设置适当的样式。以下是一些可能的原因和解决方案:

      1. 键盘的限制:不同的浏览器对键盘的限制可能不同,如果输入框在某种浏览器下无法正常输入,可能是由于浏览器的键盘限制。

      解决方案:尝试使用一些前端框架,如 Vuetify 或 Bootstrap,这些框架通常会提供键盘输入的解决方案。

      1. 输入框的样式:如果输入框的样式没有设置,可能无法正确地接收键盘输入。

      解决方案:尝试修改输入框的样式,确保它有足够的空间来容纳键盘输入。

      1. 输入框的位置:如果输入框的位置不正确,也可能无法正确地接收键盘输入。

      解决方案:确保输入框的位置在浏览器的可访问范围内。

      1. 输入框的焦点:如果输入框的焦点没有正确地切换到它,也可能无法正确地接收键盘输入。

      解决方案:检查输入框的焦点是否在它应有的位置。

      1. 输入框的大小:如果输入框的大小设置不当,可能无法正常接收键盘输入。

      解决方案:调整输入框的大小,使其足够容纳键盘输入。

      希望这些解决方案能够帮助你解决这个问题。如果你有其他问题,欢迎继续提问。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部