vuejs - dynamic input 'types'

Question

I would like to be able to dynamically change the type of an input field between text and password. I tried doing the following:

<input :type="dynamicInputType">

data() {
    return {
        dynamicInputType: 'password'
    }
}

But apparently this doesn't work; vuejs displays the error: v-model does not support dynamic input types. Use v-if branches instead.

It's not clear to me how I can fix this with v-if.

Bert · Accepted Answer · 2017-08-01 16:14:14Z

3

This kind of thing is what's being suggested.

<input v-if="'text' === dynamicInputType" type="text">
<input v-else type="password">

answered Aug 1, 2017 at 16:14

Bert

82.6k17 gold badges204 silver badges166 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1