-
mihuc说:
使用vue实现一个包含账号登录、手机号短信登录、微信扫码、重置密码、注册的登录页
面
账号登录
账号登录 账号 密码 登录 export default { data() { return { username: '', password: '', } }, methods: { loginSubmit(){ // 验证账号和密码 // 账号和密码正确，跳转到主页 // 否则，提示错误 } } };手机号短信登录
手机号登录 手机号 验证码 获取验证码 登录 export default { data() { return { phone: '', code: '', disabled: false } }, methods: { loginSubmit(){ // 验证手机号和验证码 // 手机号和验证码正确，跳转到主页 // 否则，提示错误 }, getCode(){ // 调用发送短信接口 // 发送成功，设置定时器，倒计时60s，60s后解除按钮锁定 } } };微信扫码
扫码登录 请使用微信扫描二维码登录 export default { data() { return { } }, methods: { loginSubmit(){ // 调用微信接口 // 扫码成功，跳转到主页 // 否则，提示错误 } } };重置密码
重置密码 账号 手机号 新密码 确认密码 重置 export default { data() { return { username: '', phone: '', password: '', confirmPassword: '' } }, methods: { resetSubmit(){ // 验证账号、手机号、新密码、确认密码 // 如果新密码和确认密码一致，调用接口，重置密码 // 否则，提示错误 } } };注册
注册 账号 密码 确认密码 注册 export default { data() { return { username: '', password: '', confirmPassword: '' } }, methods: { registerSubmit(){ // 验证账号、密码、确认密码 // 如果密码和确认密码一致，调用接口，注册 // 否则，提示错误 } -
wxuns说:
用原生js封装一个websocket客户端
// 封装websocket客户端 function WebSocketClient(url, options) { this._url = url; this.options = options; this._ws = null; this._init(); } WebSocketClient.prototype = { constructor: WebSocketClient, // 初始化 _init: function() { var self = this; self._ws = new WebSocket(self._url); self._ws.onopen = function(event) { self.onopen(event); }; self._ws.onmessage = function(event) { self.onmessage(event); }; self._ws.onerror = function(event) { self.onerror(event); }; self._ws.onclose = function(event) { self.onclose(event); }; }, // 向服务器端发送消息 send: function(data) { this._ws.send(data); }, // 关闭websocket连接 close: function() { this._ws.close(); }, // websocket连接建立时触发 onopen: function(event) {}, // 收到消息时触发 onmessage: function(event) {}, // 连接发生错误时触发 onerror: function(event) {}, // 连接关闭时触发 onclose: function(event) {} };
