如何在QML的TextField组件中限制仅允许输入100-5000区间的数值

问题原因 #

你遇到的现象是IntValidator的正常特性：它仅会限制输入字符必须为合法整数，输入过程中不会实时拦截超出上下限的数值，仅会在控件失焦时标记内容是否为可接受状态，所以你可以正常输入9999这类超范围数值。

解决方案 #

方案1：使用RegExpValidator实时限制输入范围（推荐） #

直接通过正则表达式限制输入的数值必须落在100~5000区间，输入过程中就会拦截不符合规则的内容：

TextField{
    id:custom_entry
    objectName: "custom_entry"
    width: 200
    placeholderText: "Enter 100ms - 5000ms"
    validator: RegExpValidator {
        regExp: /^([1-9]\d{2}|[1-4]\d{3}|5000)$/
        // 正则含义：匹配100-999 | 1000-4999 | 5000 三类数值
    }
}

如果需要允许输入过程中存在未完成的中间态（比如输入到一半的1、12不会被直接拦截，仅在输入完成后校验），可以调整正则为：/^([1-9]\d{0,3}|5000?)$/，再配合失焦校验逻辑处理即可。

方案2：保留IntValidator，补充失焦校验逻辑 #

如果不想修改验证器类型，可以在输入完成的回调里判断数值范围，超范围时自动修正：

TextField{
    id:custom_entry
    objectName: "custom_entry"
    width: 200
    placeholderText: "Enter 100ms - 5000ms"
    validator: IntValidator {bottom: 100; top: 5000;}
    onEditingFinished: {
        // 输入完成/失焦时校验，超范围就重置为最近的合法值或者清空
        let val = parseInt(text, 10)
        if(isNaN(val)) text = ""
        else if(val < 100) text = "100"
        else if(val > 5000) text = "5000"
    }
}

内容的提问来源于stack exchange，提问作者Vinay