AustinGil / vuetensils

🍴 A tasty toolset for Vue.js 🛠 - Lightweight, functional components to boost your next project.
https://vuetensils.austingil.com/
MIT License
660 stars 38 forks source link

[Vue warn]: Error in render: "TypeError: errors.get is not a function" #133

Closed Yelrado closed 2 years ago

Yelrado commented 2 years ago

The VInput will take an Object but will fail at this line

https://github.com/AustinGil/Vuetensils/blob/e3129d6fea351d47a9563d5ec9059faa64030eee/src/components/VInput/VInput.vue#L243

  1. What's the use of the errors prop? I see the reference in the doc but not an explanation

I was able to fix it by changing errors.get(key) to errorsMap.get(key) but still not sure what's the purpose.

AustinGil commented 2 years ago

Thats a good question. It's something Ive been working on. I want to make it possible for people to provide error messages. It's still a work in progress which is why I havent written any docs on it, but I think it will be a really good addition.

AustinGil commented 2 years ago

How are you using this? I didnt think anyone would run into issues with it since it shouldnt impact anything yet,

Yelrado commented 2 years ago

I was experimenting on checking if VInput had errors and if so pass a boolean to another component.

<template>
  <Vinput />
  <OtherComponent :error="errorInVInput" />
</template>

@Component
class Root extends Vue {
  private errorInVInput = false;
}

I guess I have to use $emit in order to set errorInVInput to a different value when VInput has errors but I'm string learning that.

AustinGil commented 2 years ago

That is a good use case that I think I hadnt accounted for. I think the ideal experience would be for the input component to emit a validation event, but that does not currently exist.

Can you send me a full example with codesandbox.io?

AustinGil commented 2 years ago

As it turned out, errors.get was a typo in my code. This error should be fixed with the latest version.