如何在 Vuejs 中设置刷新时的旧输入值

Posted 2023-02-22

【中文标题】如何在 Vuejs 中设置刷新时的旧输入值

【英文标题】：how can i set old input value on refresh in Vuejs

【发布时间】：2017-12-29 10:59:47

【问题描述】：

我使用 laravel 和 Vuejs

如何在 vue 动态组件中设置刷新或返回页面时输入的旧值

类似这样的：

value=" old('name') 

【问题讨论】：

你的意思是，你想在页面刷新时重置你的输入值。一个例子或重现的方法会很有帮助。

不不。想象一下，我有一个 vue 组件，它有一些输入，用户将单击（下一步），并且会出现另一个组件，当用户在浏览器中单击返回时，输入是明确的，我希望它具有它们的旧值

示例：输入元素状态从 initial_val -> temp_val -> new_val 更改，然后您进行刷新。现在，应该将 Input 元素设置为 initial_val 吗？

【参考方案1】：

在你的刀片文件中，创建一个新的脚本标签：

<script>
var oldFormData = 
  name: " old('name') ",
  //...

</script>

然后在你的组件中created回调。

created() 
  this.name = oldFormData.name // This should get  old('name')  value

您也可以通过 Vue 组件 props 传递旧数据。

假设您的组件是my-form，那么它在您的刀片文件中应该如下所示：

<my-form :oldData="name: ' old('name') '"></my-form>

然后在created:

props: ['oldData'],
created() 
  this.name = this.oldData.name

【讨论】：

确定。但我的形态不在我的刀刃上。我的刀片中只有组件标签，我的表单在我的 vue 组件中

只要组件能看到oldFormData对象就没有关系。

当我绑定一个 prop 时，它不会显示在组件中。为什么？

您尝试了我的答案的最新版本吗？

是的。我的道具将正常传递给组件。但不是当我绑定它们时