Vue.js 2 Web Development Projects

Form textarea

For the description field, we need a <textarea> element so the user can write a multiline text. Unfortunately, our FormInput component doesn't support this yet, so we need to modify it a bit. We will use the type prop of the component with the value 'textarea' to change the <input> element to a <textarea> element:

1. Let's create a new computed property to determine which kind of HTML element we are going to render:

      computed: {        // ...        element () {          return this.type === 'textarea' ? this.type : 'input'        },      },

So when the value 'textarea' is passed, we need to render a <textarea>. All the other types will make the component render an <input> element.

We can now use the special <component> component, which can render either elements ...