Nativescript vue获取具有焦点的文本字段

我在Nativescript vue应用程序中有2个文本字段

<StackLayout col="0" row="1">
  <Label text="Unit Price Excl"></Label>
  <TextField v-model="newItem.unitPriceExcl" @textChange="calcPricing" keyboardType="number" hint="Unit Price Excl"></TextField>
</StackLayout>
<StackLayout col="1" row="1">
  <Label text="Unit Price Incl"></Label>
  <TextField v-model="newItem.unitPriceIncl" @textChange="calcPricing" keyboardType="number" hint="Unit Price Incl"></TextField>
</StackLayout>

---

我想要的是，在

calcPricing

方法中，确定两个文本框中当前有焦点的文本框。

以下是您尝试执行的操作的可能实现

<TextField v-model="newItem.unitPriceExcl" @textChange="calcPricing" keyboardType="number" @focus="focus" @blur="blur" hint="Unit Price Excl"></TextField>
<TextField v-model="newItem.unitPriceIncl" @textChange="calcPricing" keyboardType="number" @focus="focus" @blur="blur" hint="Unit Price Incl"></TextField>
...
data: () => ({ focusedElement: null })
methods: {
  focus({ object }) {
    this.focusedElement = object;
  },

  // You don't have to handle blur depending on your logic, but I find it more consistent
  blur({ object }) {
    if (this.focusedElement !== object) return;
    this.focusedElement = null;
  }
}
...

...
数据：（）=>（{focusedElement:null}）
方法：{
焦点（{object}）{
this.focusedElement=对象；
},
//你不必根据你的逻辑来处理模糊，但我发现它更为一致
模糊（{object}）{
如果（this.focusedElement！==对象）返回；
this.focusedElement=null；
}
}
...

---

如果您真的不想知道哪个元素有焦点，而是想知道修改来自哪个元素。您可以这样做：

<TextField v-model="newItem.unitPriceExcl" @textChange="calcPricing('unitPriceExl')" keyboardType="number" hint="Unit Price Excl"></TextField>
...
methods: {
  calcPricing(name) {
    return (args) => {
      // Your logic goes here, you have access to name, and to args
    }
  }
}
...

...
方法：{
calcPricing（姓名）{
返回值（args）=>{
//您的逻辑在这里，您可以访问name和args
}
}
}
...

---

旁注：您还可以使用一些本机方法来查找当前关注的视图。但是请注意，这并不快，也不推荐使用，主要思想是使用NS通用api

<TextField v-model="newItem.unitPriceExcl" @textChange="calcPricing" keyboardType="number" hint="Unit Price Excl" ref="unitPriceExcl"></TextField>
...
let UIResponder;
if (isIOS) {
  UIResponder = (UIResponder as any).extend({
      currentFirstResponder() {
         this.currentFirstResponder = null;
         UIApplication.sharedApplication.sendActionToFromForEvent('findFirstResponder', null, null, null);
         return this.currentFirstResponder;
      },
      findFirstResponder(application: UIApplication) {
        this.currentFirstResponder = new WeakRef(self)
      }
    }, {
      exposedMethods: {
        currentFirstResponder: { returns: UIView, params: [ ] }
      }
    })
}
...
methods: {
  getFocusedView() {
    if (isAndroid) {
      const activity = application.android.foregroundActivity;
      if (activity) {
        return activity.getCurrentFocus()
      }
    } else if (isIOS) {
      return UIResponder.currentFirstResponder;
    }

    return null;
  },

  isFocused(object) {
    if (object.nativeView && object.nativeView.nativeView) return false;
    return this.getFocusedView() === object.nativeView.nativeView;
  },

  calcPricing(args) {
    if (this.isFocused(this.$refs.unitPriceExcl)) {
        console.log('unitPriceExcl is selected');
    }
  },
}
...

...
让UIResponder；
国际单项体育联合会（isIOS）{
UIResponder=（UIResponder，如有）。扩展({
currentFirstResponder（）{
this.currentFirstResponder=null；
UIApplication.sharedApplication.sendActionToFromForEvent（'findFirstResponder'，null，null，null）；
返回此.currentFirstResponder；
},
findFirstResponder（应用程序：UIApplication）{
this.currentFirstResponder=new WeakRef（self）
}
}, {
公开方法：{
currentFirstResponder:{返回：UIView，参数：[]}
}
})
}
...
方法：{
getFocusedView（）{
if（isAndroid）{
const activity=application.android.foregroundActivity；
if（活动）{
返回活动。getCurrentFocus（）
}
}否则如果（isIOS）{
返回UIResponder.currentFirstResponder；
}
返回null；
},
聚焦（对象）{
if（object.nativeView&&object.nativeView.nativeView）返回false；
返回此.getFocusedView（）==object.nativeView.nativeView；
},
calcPricing（args）{
if（此.isFocused（此.$refs.unitPriceExcl））{
console.log（'选择了unitPriceExcl'）；
}
},
}
...

您可以使用文本字段上的焦点/模糊事件来识别活动中的哪一个。@Manoj-我意识到有一个焦点事件。你是说我要存储某种任意变量，它是最后一个聚焦的文本字段，我可以在textchange事件中使用它吗？是的，我也是这么建议的。

<TextField v-model="newItem.unitPriceExcl" @textChange="calcPricing" keyboardType="number" hint="Unit Price Excl" ref="unitPriceExcl"></TextField>
...
let UIResponder;
if (isIOS) {
  UIResponder = (UIResponder as any).extend({
      currentFirstResponder() {
         this.currentFirstResponder = null;
         UIApplication.sharedApplication.sendActionToFromForEvent('findFirstResponder', null, null, null);
         return this.currentFirstResponder;
      },
      findFirstResponder(application: UIApplication) {
        this.currentFirstResponder = new WeakRef(self)
      }
    }, {
      exposedMethods: {
        currentFirstResponder: { returns: UIView, params: [ ] }
      }
    })
}
...
methods: {
  getFocusedView() {
    if (isAndroid) {
      const activity = application.android.foregroundActivity;
      if (activity) {
        return activity.getCurrentFocus()
      }
    } else if (isIOS) {
      return UIResponder.currentFirstResponder;
    }

    return null;
  },

  isFocused(object) {
    if (object.nativeView && object.nativeView.nativeView) return false;
    return this.getFocusedView() === object.nativeView.nativeView;
  },

  calcPricing(args) {
    if (this.isFocused(this.$refs.unitPriceExcl)) {
        console.log('unitPriceExcl is selected');
    }
  },
}
...