update

Author: lensh

README.md

@@ -4,7 +4,7 @@ Vue全家桶+Socket.io+Express/Koa2打造的网页版手机QQ(web app),高仿手
 
 ## 预览
 
-在线预览地址：http://lenshen.com:8080/
+在线预览地址：http://lenshen.com:8080/ （为了体验到最佳的效果，提供了3个测试账号，需要账号才能登陆哦，具体账号和密码下面有讲）
 
 ## 技术栈
 * **Vue2.0**：实现前端页面构建
@@ -27,7 +27,7 @@ Vue全家桶+Socket.io+Express/Koa2打造的网页版手机QQ(web app),高仿手
 
 ## 使用方式
 
-先将根目录下的qq.sql导入到你的MySQL数据库里(可以使用Navicat)，用户名为root，登录密码为空。启动MySQL服务。然后使用cnpm install 安装所有依赖，最后运行npm run dev。服务器部署只需要运行npm run pm2（前提是得先全局安装pm2）。
+先将根目录下的qq.sql导入到你的MySQL数据库里(可以使用Navicat)，用户名为root，登录密码为空。启动MySQL服务。然后使用cnpm install 安装所有依赖(最好用cnpm安装，因为项目依赖很多，npm用的是国外的镜像，在网络不稳定的情况下很有可能会导致安装失败，而且下载速度远远慢于国内的cnpm)，最后运行npm run dev。服务器部署运行项目只需要npm run pm2，这样就可以常驻进程，不过前提是得先全局安装pm2。
 
 尽量使用Chrome浏览器体验最佳效果。另外提供了三个测试账号，默认用户的密码都是6个1:
 
@@ -179,3 +179,7 @@ socket.io最核心的两个api就是`emit` 和 `on`了 ，服务端和客户端
 `socket.emit()`：向服务端发送消息
 
 `socket.on()`：监听服务端发来的信息
+
+## 最后
+
+如果觉得不错，就毫不吝啬地给个star吧。后期项目还会继续更新和完善。

index.html

@@ -12,7 +12,7 @@
 
     <script src="http://localhost:3000/socket.io/socket.io.js"></script>
     <script>
-      const socket = io.connect('http://localhost:3000/')
+      const socket = io.connect('http://localhost:3000/')
 
       //解决用户手动刷新浏览器后，原来的socketid失效的问题
       const loginStatus= JSON.parse(localStorage.getItem("loginStatus") || '{}')

src/App.vue

@@ -10,10 +10,7 @@ import {mapGetters} from 'vuex'
 export default {
   name: 'app',
   computed: {
-    ...mapGetters([
-      'isLogin',
-      'userId'
-    ])
+    ...mapGetters(['isLogin'])
   },
   created(){
     //如果不是首次启动,且没有登陆,则跳到登录页面
@@ -38,7 +35,6 @@ html, body {
   width: 100%;
   height: 100%;
   overflow: hidden;
-
   font-family: 'Microsoft Yahei' !important
 }
 #app,.wrapper{

src/components/Friend/searchFriend.vue

@@ -17,8 +17,8 @@
 			</div>
 			<div class="search_result" v-show="hasSearch">	
 				<p v-show="!hasResult" class="no_result">没有找到相关结果</p>
-				<VScroll :data="dataList">
-					<ul v-show="hasResult&&hasManyResult">
+				<VScroll :data="dataList" v-show="hasResult&&hasManyResult">
+					<ul>
 						<li v-for="item in dataList"
 							@click="$router.push(`/profile/${item.id}`)">
 						    <img :src="item.face" class="user">

src/components/Register/Register.vue

@@ -327,6 +327,9 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss" type="text/css">
+.wrapper{
+  background:#fff !important;
+}
 .top{
   background: url(/static/icon/4/fas.9.png) no-repeat left center;
   width: 100%;

src/components/Social/Social.vue

@@ -51,6 +51,9 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss" type="text/css">
+.wrapper{
+  background:#FFFDFD !important;
+}
 .search{
    margin-top: 50px;
 }

src/components/User/Profile.vue

@@ -145,8 +145,11 @@ export default {
 </script>
 
 <style scoped lang="scss" type="text/css">
+.wrapper{
+	background:#fff !important;
+}
 .header{
-	  display:flex;
+	display:flex;
     padding:0 20px;
     height:50px;
     line-height:50px;
@@ -159,7 +162,7 @@ export default {
     width:100%;
     z-index:1;
     .item{
-    	  flex:1;
+    	 flex:1;
         &.left{
             background:url(/static/icon/4/flc.png) no-repeat left center;
             margin-left:-10px;

src/components/Welcome/Welcome.vue

@@ -25,6 +25,9 @@ export default {
 </script>
 
 <style scoped lang="scss" type="text/css">
+.wrapper{
+  background:#fff !important;
+}
 .welcome{
   position:absolute;
   width:100%;