Captcha with TS

[Fomicha]

I have got a problem with TypeScript implementation. In JS everything is ok.

 Property 'reset' does not exist on type 'Vue | Element | Vue[] | Element[]'.
 Property 'reset' does not exist on type 'Vue'.
   
onCaptchaExpired() {
   this.$refs.invisibleRecaptcha.reset();
}

the same with .execute(); as well.

[DanSnow]

You need to cast it to VueRecaptcha, like:

import VueRecaptcha from 'vue-recaptcha'

...

const invisibleRecaptcha = this.$refs.invisibleRecaptcha as VueRecaptcha
invisibleRecaptcha.reset()

[Fomicha]

Ok6 thanx!
But it didn’t help.
The same error in the browser console

vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in v-on handler: "TypeError: Cannot read property 'execute' of undefined"

found in

---> <MainForm> at src/views/main-screen/components/main-form.component.vue
       <MainScreen> at src/views/main-screen/main-screen.component.vue
         <MdContent> at src/components/MdContent/MdContent.vue
           <App> at src/App.vue
             <Root>
warn @ vue.runtime.esm.js?2b0e:619
logError @ vue.runtime.esm.js?2b0e:1884
globalHandleError @ vue.runtime.esm.js?2b0e:1879
handleError @ vue.runtime.esm.js?2b0e:1839
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1862
invoker @ vue.runtime.esm.js?2b0e:2179
original._wrapper @ vue.runtime.esm.js?2b0e:6917
vue.runtime.esm.js?2b0e:1888 TypeError: Cannot read property 'execute' of undefined
    at VueComponent.sendFormData (main-form.component.vue?21fe:128)
    at submit (main-form.component.vue?87e4:18)
    at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
    at HTMLFormElement.invoker (vue.runtime.esm.js?2b0e:2179)
    at HTMLFormElement.original._wrapper (vue.runtime.esm.js?2b0e:6917)

Do you have any ideas why it happened?

[DanSnow]

I can't provide much help without you to provide more code. But let me guess: maybe you have a typo when setting ref?

[Fomicha]

Hi Dan!
Sorry for delayed answer, task was on hold, but now it's actual again.
I have trouble after deploying app to env. But before everything is fine and I got token in follow function

onVerify(response) {
      this.form.recaptcha = response;
      console.log('Verify: ' + response);
    }

but after deploy I had got next error:

126:35 Property 'execute' does not exist on type 'Vue | Element | Vue[] | Element[]'.
 Property 'execute' does not exist on type 'Vue'.
    124 |     sendFormData(e) {
    125 |       this.$v.form.$touch();
  > 126 |       this.$refs.invisibleRecaptcha.execute();

What could be wrong?
Thnx