Vuejs FontAwesome眼睛图标显示和隐藏密码

时间:2018-06-02 14:50:06

标签: javascript html vue.js passwords font-awesome

我正在尝试使用字体真棒眼睛图标来显示和隐藏用户尝试登录时的密码。图标确实显示,但我无法显示输入的字符。有人可以帮帮我吗

以下是我用于密码的html代码。您可以在v-show和@click函数中看到的密码是javascript中的空字符串。

如果有人可以帮助我完成这项工作,那将非常感激。

HTML:

<div class="passwordInputArea">
                        <span class="passwordEye" v-show="password">
                           <span><font-awesome-icon :icon="['fas', 'eye']" @click="password = !password" /></span>
                        </span>

                        <input name="password" type="password" v-model="password" v-validate="'required'" placeholder="Password" class="epForm epInput pSection" id="password" />
                        <p v-show="wrong.password">
                            Password is missing or incorrect. Please try again!
                        </p>
                        <p v-show="wrong.all">
                            Login Details Incorrect!
                        </p>
                    </div>

非常感谢!

0 个答案:

没有答案