Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Textarea attribute :type="null" throws error #2766

Closed
yustnip opened this issue Dec 8, 2020 · 4 comments · Fixed by #2888
Closed

Textarea attribute :type="null" throws error #2766

yustnip opened this issue Dec 8, 2020 · 4 comments · Fixed by #2888
Assignees

Comments

@yustnip
Copy link

yustnip commented Dec 8, 2020

Version

3.0.4

Reproduction link

https://codesandbox.io/s/affectionate-ganguly-q4153?file=/src/App.vue

Steps to reproduce

Insert <textarea /> and specify type attribute as null or undefined.

What is expected?

Attribute has not been rendered according with the Vue 3 documentation - https://v3.vuejs.org/guide/template-syntax.html#attributes

What is actually happening?

Throws the error: Uncaught (in promise) TypeError: Cannot set property type of # which has only a getter


Vue 2 app in the same case works correct

@posva
Copy link
Member

posva commented Dec 8, 2020

You cannot set the type of a textarea: https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element. It's a readonly property.
Maybe the attribute shouldn't be set if the value is null or undefined

@yustnip
Copy link
Author

yustnip commented Dec 8, 2020

Yes, it is. But I can't remove it another way. Example:

<template>
  <component
    :is="tag"
    :type="tag === 'input' ? 'text' : null"
  />
</template>

<script lang="ts">
  import { defineComponent } from 'vue';

  export default defineComponent({
    props: {
      tag: {
        type: String,
        default: 'input', // or textarea
      },
    },
  });
</script>

@posva
Copy link
Member

posva commented Dec 8, 2020

you can with a v-bind="tag === 'input' ? { input: 'text' } : {}"

@yustnip
Copy link
Author

yustnip commented Dec 9, 2020

Thanks, it works!

luwuer added a commit to luwuer/vue-next that referenced this issue Dec 17, 2020
@LinusBorg LinusBorg self-assigned this Dec 22, 2020
LinusBorg pushed a commit that referenced this issue Dec 26, 2020
on textarea is handled patched as attribute

close #2766
yyx990803 pushed a commit that referenced this issue Feb 24, 2021
…tched as attribute (#2888)

close #2766

Co-authored-by: Thorsten Luenborg <[email protected]>
@github-actions github-actions bot locked and limited conversation to collaborators Oct 25, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.