如何在Vue.js中将输入保存到本地存储中的输入
如何在Vue.js中将输入保存到本地存储中的输入
提问于 2019-04-10 03:27:11
我做所有的事情，例如从官方的Vue.js站点。但是我需要使用框架7，并且在输入中我显示了object InputEvent。当我尝试写一些文本时，对象InputEvent也会显示出来。
如何在本地存储中保存一个名称并在输入中显示它？
框架7中的PS v-model不起作用
<f7-list form>
<f7-list-input
label="Username"
name="username"
placeholder="Username"
type="text"
v-bind:value="name"
required validate
pattern="[3-9a-zA-Zа-яА-ЯёЁ]+"
@input="persist"
/>
</f7-list>
<script>
export default {
data() {
return{
name: '',
}
},
mounted() {
if (localStorage.name) {
this.name = localStorage.name;
}
},
methods: {
persist(){
name=$event.target.value;
localStorage.name = this.name;
}
}
};
</script>回答 2
Stack Overflow用户
回答已采纳
发布于 2019-04-10 03:52:17
使用适当的本地存储方法更新了代码，并删除了导致问题的行
替换
name=$event.target.value;
使用
this.name = $event.target.value;请在下面找到更新的方法和重构代码的更新代码。
<f7-list form>
<f7-list-input
label="Username"
name="username"
placeholder="Username"
type="text"
v-bind:value="name"
required validate
pattern="[3-9a-zA-Zа-яА-ЯёЁ]+"
@input="persist"
/>
</f7-list>
<script>
export default {
data() {
return{
name: '',
}
},
mounted() {
if (localStorage.name) {
//retrive name from localstorage here.
this.name = localStorage.getItem('name')
}
},
methods: {
persist(){
/* set name to localstorage here
using setItem is recommended way of doing but even without that yourcode should work.*/
localStorage.setItem('name', $event.target.value)
}
}
};
</script>Stack Overflow用户
发布于 2019-04-10 03:31:40
简单地说：
localStorage.setItem('name', this.name)
this.name = localStorage.getItem('name')页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55599932
复制相关文章
相似问题