单击表单字段开始 inputting/overriding 现有值

clicking the form field start inputting/overriding existing value

我被要求执行以下操作:

允许用户单击字段中的任意位置并开始输入,然后在输入时覆盖数字。

当用户单击他们试图重新输入修改后的数字的数字旁边时,我的解决方案有效。我认为这在 UI 实践中是相当标准的。有没有人有关于如何实现粗体区域所要求的解决方案,通过单击该字段更新 phone 数字字段,然后开始 inputting/overriding.?

//have an observer on the following function:

static get observers() { return [
    _workNumber(_contract.workPhone),
}}

_workNumber(str) {

    let cleaned = ('' + str).replace(/\D/g, '');
    let match = cleaned.match(/^(\d{3})(\d{3})(\d{4})$/);
    if (match) {

        //the binding value in the input tag in HTML.
        this._contract.workPhone = '(' + match[1] + ') ' + match[2] + '-' + match[3];
        return '(' + match[1] + ') ' + match[2] + '-' + match[3]
    };

        return null

};

这里需要的是与插入键一样的“改写”。

See here