V-Model的VUEJS输入仅接受一个字符
我有一个带有每个单元格输入的表的VUE 1应用程序。
有问题的部分在一排中有3个字段：
- DX
- SX
- DIFF
我希望，当DX和SX填充时，diff成为差异在两个之间。
为此，我为每个dx和sx字段设置了一个观察者，该字段在填充两个相应输入时会计算差异。
'athlete.inputs[testData.edf.abdother.dx.id].comment': function(){
this.calcDiff('abdother.dx.id')
},
'athlete.inputs[testData.edf.abdother.sx.id].comment': function(){
this.calcDiff('abdother.sx.id')
},
...
calcDiff: function(input){
console.log('calculating diff', this.athlete);
input = input.split('.')
var dx = this.athlete.inputs[this.testData.edf[input[0]]['dx'][input[2]]].comment
var sx = this.athlete.inputs[this.testData.edf[input[0]]['sx'][input[2]]].comment
console.log({dx, sx})
if (!dx || !sx)
return;
this.athlete.inputs[this.testData.edf[input[0]]['diff'][input[2]]].comment = dx >= sx ? dx - sx : sx - dx
},
设置全部后，我尝试更改一些值：
- 如果我输入一个字符，如果我输入第二个字符（或更多）字符，则一切正常
- ，突然间，属性的值变为null
如您所见，如果我输入1个记录正确的值，但是如果我输入第二个值，则将变为null。如果我删除除一个字符外的所有字符，那么它将再次开始工作。
将两个输入中的一个字符设置为预期的工作，它计算出差异并将其放置在正确的位置。
更多字符立即将变量放开，并在取消关注后立即清空该字段。
有什么想法吗？
I have this Vue 1 application with a table that has an input for every cell.
The problematic part in particular has 3 fields on a row:
- dx
- sx
- diff
I want that when dx and sx are filled, diff becomes the difference between the two.
To achieve this I set up a watcher for each dx and sx fields that calculates the difference when both corresponding inputs are filled.
'athlete.inputs[testData.edf.abdother.dx.id].comment': function(){
this.calcDiff('abdother.dx.id')
},
'athlete.inputs[testData.edf.abdother.sx.id].comment': function(){
this.calcDiff('abdother.sx.id')
},
...
calcDiff: function(input){
console.log('calculating diff', this.athlete);
input = input.split('.')
var dx = this.athlete.inputs[this.testData.edf[input[0]]['dx'][input[2]]].comment
var sx = this.athlete.inputs[this.testData.edf[input[0]]['sx'][input[2]]].comment
console.log({dx, sx})
if (!dx || !sx)
return;
this.athlete.inputs[this.testData.edf[input[0]]['diff'][input[2]]].comment = dx >= sx ? dx - sx : sx - dx
},
After setting all up I tried changing some values:
- If I enter one character everything works fine
- If I enter a second (or more) characters, suddenly the value of the property becomes null
As you can see from the picture, if I enter 1 it logs the correct value, but if I enter a second value it becomes null. If I delete all the characters but one then it starts working again.
Setting one character in both inputs works as expected, it calculates the difference and places it in the right place.
More characters immediately unsets the variable and empties the field as soon as you unfocus it.
Any ideas?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
问题很可能是
string.split（）在 javascript 。因为。是REGEX中的通配符，所以您的input.split（'。'）在每个字符上分开。尝试在。之前添加后斜线The problem is most likely that
String.split()uses regular expressions in JavaScript. Because.is the wildcard in regex, yourinput.split('.')is splitting on every character. Try adding a backslash before the.