No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Quasar + TypeScript + Vuelidate errors.

    Help
    2
    3
    884
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • R
      RobertIvoire last edited by RobertIvoire

      EDIT: Updating quasar with quasar upgrade --install then restarting VSCode fixed my problem.

      Hello,

      I’ve been trying to add validations with Vuelidate to my quasar application but I have a little problem. I can make it work just fine, by my code is filled with red errors (even though it compiles and validation works as intended). Here are my configs:

      Boot file (registered in quasar conf):

      import Vuelidate from 'vuelidate';
      import { boot } from 'quasar/wrappers';
      
      export default boot(({ Vue }) => {
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Vue.use(Vuelidate as any);
      });
      

      I can console.log(this.$v) just fine, use it on inputs like:

      :error="$v.field.nested.$invalid"
      error-message="test error"
      

      with

      validations: {
        field: {
          nested: {
            required
          }
        }
      },
      

      My problem is there, the whole validations property is red, even though data(), components, methods, etc aren’t. I’m using this syntax for my component:

      export default Vue.extend({
      ...
      

      Inside a <script lang=“ts”> tag.

      Some error message I have:

      Object literal may only specify known properties, and 'validations' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<...>>'.
      
      Property '$v' does not exist on type 'CombinedVueInstance<Vue, unknown, unknown, unknown, Readonly<Record<never, any>>>'.
      

      It also adds error on all my other properties, even though they work.
      I feel like this is linked to TypeScript, but I’m not sure how to solve it.

      Anyone else use Vuelidate with Quasar and Typescript? If so, how did you manage to not have all these errors?
      Thanks.

      1 Reply Last reply Reply Quote 1
      • R
        RobertIvoire last edited by

        This post is deleted!
        1 Reply Last reply Reply Quote 0
        • Y
          yananas last edited by

          Having the same issues with the same stack. Were you able to fix it?

          1 Reply Last reply Reply Quote 1
          • First post
            Last post