基本输入隐藏文本而不是在字段内显示它答案

【问题标题】：Base Input hides text instead of showing it inside the field基本输入隐藏文本而不是在字段内显示它
【发布时间】：2020-09-10 23:19:07
【问题描述】：

我已经为 Vue.js 下载了 this design kit。

问题是，当我在其中写文本时，它会查看我写的文本，但是当我从字段中聚焦后，文本被隐藏并显示占位符，但我不明白为什么它就是这样做的。

当我在写入后打印字段的值时，我得到了我写的值，但我根本看不到它在字段内。

这是我正在使用的代码：

<base-input class="input-group-alternative mb-3"
    :placeholder="email"
    addon-right-icon="ni ni-email-83"
    v-model="emailVal"
    required="true"
    :dir="dir">
</base-input>

我将email 参数作为“电子邮件地址”传递，将dir 参数作为“ltr”传递。

能否请您帮助我理解为什么它不能将我的输入保留在字段中？

【问题讨论】：

所以你的意思是 placeholder 不是 base-input 的道具之一，并且你将 base-input 代码更改为接受 placeholder ？如果是这种情况，您可能还需要向我们展示您如何更改 base-input 代码，因为添加该道具后可能存在一些冲突
@JakeLam 我的错，显然它与占位符无关，因为我只是试图删除占位符道具并且文本仍然隐藏。也编辑了问题
您是否在数据对象中声明了emailVal
@JakeLam 不，显然这解决了问题。谢谢！

标签： vue.js input placeholder

【解决方案1】：

显然问题在于我没有在我的数据对象中声明emailVal。
我是这样添加的，它起作用了：

export default {
    data() {
        return {
            email: 'Email Address',
            dir: 'ltr',
            emailVal: ''
        }
    }
}

【讨论】：