如何使用Nuxt.js将数据存储到本地存储

问题描述

您知道，nuxtjs是服务器端渲染，没有很好的示例将数据存储到客户端的本地存储中.

As you know, nuxtjs is server side rendering and there is no good example how to store data into localstorage which is client side.

我的工作需要构建登录表单，用户可以在其中输入用户名和密码，然后将其发送到服务器(通过api)进行检查，如果登录数据正确，则api将返回一个令牌密钥，然后我将进行存储验证此密钥是否为用户已通过身份验证，并与其他api一起使用.

My work is need to build login form where user can put username and password into the form the send it to server (via api) to check, if login data is correct, the api will return one token key then I will store this key to verify is user is authen and use it with other api.

我找到了一个示例，但在这里 https://auth0进行构建.com/blog/build-an-app-with-vuejs/，但我不知道如何将其更改为nuxtjs.

I found some example but build with vuejs here https://auth0.com/blog/build-an-app-with-vuejs/ but I don't have an idea how to change it to nuxtjs.

任何我读过的 https://github.com/robinvdvleuten/vuex-persistedstate 我可以插入我的项目，但我想查看其他解决方案.

Any I have read https://github.com/robinvdvleuten/vuex-persistedstate which I can plug in to my project but I would like to see other solution.

关于.

推荐答案

nuxtjs为您提供 process.browser ，告诉它仅在客户端执行

nuxtjs provides you with process.browser to tell it to execute only on the client side

所以像这样使用它:

methods:{
    storeToken(token){
        if(process.browser){
            localStorage.setItem("authToken", token);
        }
    }
}

有关更多信息，请参见此链接

see this link for more info

这篇关于如何使用Nuxt.js将数据存储到本地存储的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！