2018-03-11 用vue做简历制作工具2

image.png

现在做保存功能
监听“保存”事件（用户点保存）

image.png

双引号里不是字符串，而是一个函数，如果要写入字符串，则在双引号里再加单引号

我们把要保存的数据存到leancloud上
找到“保存对象”

做注册登录功能

image.png

我们用用户密码注册的方式

image.png
image.png
怎么弹出登录界面呢？

简单点：div
复杂点：使用路由

这里先使用div

image.png
image.png
image.png

手机注册流程

image.png
image.png
如果form表单里的第一个按钮如果没有type的话，那么这个button就是提交按钮
这样有问题，要改下 image.png image.png

短信签名要审核
那就放弃，换种方式
用用户名和密码

image.png
image.png
image.png

开始做登录界面
leancloud会自动判断注册的和登录的一不一样，有问题会提示
如果登录成功了

image.png

session可以通过cookie来实现，也可以通过local storage实现

image.png
image.png
image.png
image.png

接下来做登出
方法一：把localstorage里的数据删掉

image.png
image.png
问题：页面刷新的时候，会有个紫色匡闪一下，原因：CSS在JS之前加载完的
image.png
加v-cloak，使得其刚开始的时候先隐藏掉
image.png

只要css一加载，就会隐藏掉，同时只要js一加载，就会把js里的这个v-cloak删掉
在登出之前要检测下是否有用户当前存在

问题，js中有，html中没有 （面试问题）

image.png image.png

添加/删除属性，vue是没办法知道的
解决方法：让其刚开始就有默认属性，空的也行
通过当前用户是否存在id来显示或隐藏页面中的按钮“登出”

image.png
image.png
image.png

加不加JSON.stringify的值不一样（按道理应该一样）
var obj={}
JSON.stringify(obj)
"{}"
var obj={name:'tsl'}
JSON.stringify(obj)
"{"name":"tsl"}"
var obj={name:'tsl',
toJSON:1}
JSON.stringify(obj)
"{"name":"tsl","toJSON":1}"
var obj={name:'tsl',
toJSON:function(){
return {fuck:1}
}}
JSON.stringify(obj)
"{"fuck":1}"
这里toJSON是函数的时候，JSON.stringify只返回了函数了，name不管了

image.png
MDN文档里也写了