也许这是一个奇怪的问题,但我是Vue的新手,我还没有找到答案. 当我使用v-if和v-Else时,一切都很正常:
<CodeForm v-if="isLoginFormSent" />
<LoginForm v-else />
但在我重新加载页面后,一切都返回到v-if状态.有没有办法确保在页面重新加载后显示v-Else状态?
也许这是一个奇怪的问题,但我是Vue的新手,我还没有找到答案. 当我使用v-if和v-Else时,一切都很正常:
<CodeForm v-if="isLoginFormSent" />
<LoginForm v-else />
但在我重新加载页面后,一切都返回到v-if状态.有没有办法确保在页面重新加载后显示v-Else状态?
这是Vue的预期行为,或者我们可以说这就是Vue的工作方式.在页面重新加载时,应用程序的状态为reset
,因此根据初始条件或默认数据属性,组件将为re-rendered
.
为了在页面刷新时也保存数据变量,您需要以某种方式使用HTML5Web存储机制将其存储在localStorage
、sessionStorage
或cookie
中.
可以通过localStorage.setItem()
进行设置:
localStorage.setItem('isLoginFormSent', JSON.stringify(<value>));
然后在created()
或mounted()
生命周期钩子中加载页面:
localStorage.getItem('isLoginFormSent');