定义登录时需要用的数据与方法(useLogin)

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

新建一个文件,放在 app/login 的下面,名字是 hook.ts,在文件里定义并导出一个 Hook,名字是 useLogin,它是一个函数。

在这个函数里面准备两个数据 ,解构数组,声明 name 还有 setName,等于 useState ,默认值是空白。这个 name 就是在登录的时候要提供给服务端的用户的名字。下面再解构声明 password,还有 setPassword,用一下 useState,默认值是空白字符。这个 password 是登录的时候要提供的用户密码。

下面在定义一个登录用的方法,名字叫 login,用 async 标记一下这个函数,函数里面判断一下 name 还有 password,声明一个 response,用一下 await apiHttpClient,请求的接口地址是 login,提供一个配置对象参数,把请求用的 method设置成 POST。

然后需要设置一下 Content-Type 这个头部,添加一个 headers,在它里面设置一下 Content-Type 这个头部,值可以设置成 application/json。

下面需要设置一下请求的时候要带的主体数据,设置一下 body 这个属性的值,用一下 JSON.stringify ,提供一个对象,里面添加一个 name 还有 password。

再声明一个 data,等于 await ,用一下 response.json()。 下面可以在控制台上输出这个 data 检查一下。

最后让这个 useLogin 返回一个对象,里面添加一个 name,setName,password,setPassword,还有 login。

定义登录时需要用的数据与方法(useLogin)《 Next.js:身份验证 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点