• 【vue】@input


    问题1: windows 电脑用微软中文输入法输入一个字符会显示多个
    问题2: mac或者其他中文输入法输入都会有闪烁的抖动感
    问题3:由于需求所定,这是一个自定义的输入框,并且要实时更新,所以用不了v-model 与@blur
    (用mac电脑没重现输入一个字符变多个,截图了测试提的bug,bug被关了只剩个模糊的图片~~~)

    问题分析

    使用 :value, @input - 输入法异常;
    使用 v-model 指令 - 输入法正常;
    使用@blur- 输入法正常。

    1. v-model源码分析
      v-model使用的也是input事件

      v-model 判断了 composing 属性,当输入法组合没有结束的时候,直接返回,并没有赋值

    2.@blur是失焦后才赋值,此时输入法已结束;@input 没有检测输入法结束就直接赋值。

    问题思考

    是否可以参考v-model的方法,监测输入法结束时再给value赋值

    参考v-model 使用的Composition

    根据官方规范,Composition 事件触发顺序如下:
    1. 输入开始时触发 compositionstart
    2. 选择字/词完成输入时触发 compositionend

    那么通过 Composition 事件,在 compositionend 赋值而非直接赋值既可

  • 相关阅读:
    AJAX
    Aliyun服务器配置Redis
    Aliyun服务器配置MySQL
    Python基础之迭代器详解
    Python基础之函数
    Flask入门--URL
    认识Web
    肖知兴:企业的底层逻辑与企业家的突破(下)
    建造者模式(Bulider模式)详解
    为什么我强烈推荐你用枚举来实现单例模式
  • 原文地址:https://www.cnblogs.com/whkl-m/p/15331463.html
Copyright © 2020-2023  润新知