alive

src/App.vue

@@ -1,5 +1,8 @@
 <template>
-	<div id="weixin">
-		<router-view></router-view>
+	<div>
+		<keep-alive>
+			<router-view v-if="$route.meta.keepAlive"></router-view>
+		</keep-alive>
+		<router-view v-if="!$route.meta.keepAlive"></router-view>
 	</div>
 </template>

src/components/findandMe/findandMe.vue

@@ -5,14 +5,14 @@
 				<div class="find_wipe">
 					<div class="findlist_left">
 						<section class="findlist_svg " :class="{'findlist_svg_me' : $route.path.indexOf('me') !== -1}">
-							<img :src="userInfo.headurl" alt="" v-if="pathUrl">
+							<img :src="userHeader" alt="" v-if="pathUrl">
 							<svg v-else>
 								<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#friendcircle"></use>
 							</svg>
 						</section>
 						<section class="me_name" v-if="pathUrl">
-							<div>{{userInfo.petname}}</div>
-							<div>微信号：{{userInfo.wxid}}</div>
+							<div>{{userInfo.name}}</div>
+							<div>微信号：{{userInfo.name}}</div>
 						</section>
 						<section class="findlist_text" v-else>
 							朋友圈
@@ -130,34 +130,37 @@
 <script>
 	import {userInfo} from 'src/service/getData'
 	import {imgurl} from 'src/config/env';
-	import {mapState,mapMutations} from 'vuex';
+	import {mapState,mapActions,mapMutations} from 'vuex';
 	import {circle} from 'src/service/getData' 
 	export default{
 		data(){
 			return{
-				pathUrl:this.$route.path.indexOf("me") !== -1,
+				pathUrl : this.$route.path.indexOf("me") !== -1,
 				userInfo:{},			//用户信息
 				alertreminder:false,	//弹出层是否显示
 				remindershow:false,		//显示时的动画
 				reminderhide:false,		//隐藏时的动画
 				gifSrc:'',
 				timer:null,
 				newGetImage:'',			//朋友圈动态第一个头像
+				userHeader:''			//用户头像
 			}
 		},
 		props: ['mepart',],
 		created(){
+
 			this.gifSrc=imgurl+'reminder.gif';
 		},
 		beforeDestroy(){
             clearTimeout(this.timer) 
         },
 		beforeMount(){
-			userInfo().then((res) => {
-				this.userInfo = res
-			});
+			this.getUserInfo();
 		},
 		mounted(){
+			this.userInfo=this.userInfo;
+			this.userHeader=imgurl + this.userInfo.avatar
+			console.log(this.userHeader)
 			circle().then( (res) =>{
 				for(let i=0; i < res.length; i++){
 					this.newGetImage=res[0].headurl;
@@ -170,10 +173,13 @@
 		},
 		computed:{
 			...mapState([
-				'firendwarn', 
+				'firendwarn', 'userInfo'
 			]),
 		},
 		methods:{
+			...mapActions([
+                'getUserInfo',
+            ]),
 			 ...mapMutations([
 				"CHANGE_RED",
 			]),

src/components/footer/foot.vue

@@ -63,7 +63,7 @@
 				</section>
 				<section class="li_text" :class="$route.path.indexOf('me') !== -1 ? 'colortext' : 'color' " >我</section>
 			</router-link>
-		</ul>
+		</ul>	
 	</div>
 </template>
 

src/frames/addressbook/addressbook.vue

@@ -73,8 +73,14 @@
 		</section>
 		<section class="peoplenum">{{peoplenum}}位联系人</section>
 		<foot-guide></foot-guide>
+
 		<transition name="router-show">
-		    <router-view></router-view>
+			<keep-alive>
+				<router-view v-if="$route.meta.keepAlive"></router-view>
+			</keep-alive>
+		</transition>
+		<transition name="router-show">		
+			<router-view v-if="!$route.meta.keepAlive"></router-view>
 		</transition>
 	</section>	
 </template>

src/frames/conversation/groupchat.vue

@@ -200,7 +200,6 @@
 	            			groupData.history.splice(i,1);
 	            			i=i-1
 	            		}
-	            		
 	            	}
             		this.groupconversine = [...groupData.history, ...this.groupconversine]
             	}

src/frames/dialogue/dialogue.vue

@@ -94,6 +94,7 @@
 <script>
 	import headTop from 'src/components/header/head'
 	import footGuide from 'src/components/footer/foot'
+	import {imgurl} from 'src/config/env';
 	import {mapState,mapActions,mapMutations} from 'vuex'
 	import {groupChat, userInfo, login} from 'src/service/getData'
 	import fetch from 'src/config/fetch'
@@ -113,7 +114,6 @@
 				borderColortwo: false,
 				timer:null,	
 				groupHead:[],
-
 			}
 		},
 		created(){
@@ -127,7 +127,8 @@
 		},
 		mounted(){	
 			groupChat().then( (res) =>{
-				this.groupHead=res.grouphead
+				this.groupHead=[...res.grouphead]
+				
 			});
 			
 		},

src/frames/find/friendcircle/friendcircle.vue

@@ -10,9 +10,9 @@
 					</div>
 					<div class="themetext" :class="{shoowimg : imagestatus}">轻触更换主题照片</div>
 					<div class="personImg">
-						<div class="personame">{{userInfo.petname}}</div>
+						<div class="personame">{{userInfo.name}}</div>
 						<div class="headimg" @click="personInfor">
-							<img :src="userInfo.headurl" alt="">
+							<img :src="userHeader" alt="">
 						</div>
 					</div>
 				</div>
@@ -61,7 +61,6 @@
 												</svg>
 												<span>评论</span>
 											</div>
-
 										</div>
 									</div>
 
@@ -106,6 +105,7 @@
 	import headTop from 'src/components/header/head'
 	import uploadPreview from 'src/config/uploadPreview.js' 
 	import {animate} from 'src/config/mUtils' 
+	import {imgurl} from 'src/config/env';
 	import {circle} from 'src/service/getData' 
 	import {mapState, mapActions, mapMutations} from 'vuex'
 	export default{
@@ -130,6 +130,8 @@
 				changeinput:false,		//控制发送按钮状态的改变
 				criticismstate:false,	//评论显隐
 				itemlist:{},			//点击当前的li
+				userInfo:{},			//用户信息
+				userHeader:''			//用户头像
 
 			}
 		},
@@ -141,6 +143,8 @@
             clearTimeout(this.timers); 
         },
 		mounted(){
+			this.userInfo=this.userInfo;
+			this.userHeader=imgurl + this.userInfo.avatar
 			//上传图片并展示图片（无剪裁功能）
 			new uploadPreview({
 				UpBtn: "input_file",

src/frames/me/personaldetails/personaldetails.vue

@@ -5,15 +5,15 @@
 			<section class="privacy_top">
 				<div class="privacy_child">
 					<span>头像</span>
-					<img :src="userInfo.headurl" alt="">
+					<img :src="userHeader" alt="">
 				</div>
 				<div class="privacy_child">
 					<span>昵称</span>
-					<span>{{userInfo.petname}}</span>
+					<span>{{userInfo.name}}</span>
 				</div>
 				<div class="privacy_child">
 					<span>微信号</span>
-					<span>{{userInfo.wxid}}</span>
+					<span>{{userInfo.name}}</span>
 				</div>
 				<div class="privacy_child">
 					<span>二维码名片</span>
@@ -46,18 +46,21 @@
 
 <script>
 	import headTop from 'src/components/header/head'
+	import {imgurl} from 'src/config/env';
 	import {mapState, mapActions} from 'vuex'
 	export default{
 		data(){
 			return{
-				
+				userInfo:{},			//用户信息
+				userHeader:''			//用户头像
 			}
 		},
 		created(){ 
 			this.getUserInfo();
 		},
 		mounted(){
-			
+			this.userInfo=this.userInfo;
+			this.userHeader=imgurl + this.userInfo.avatar
 		},
 		components:{
 			headTop,

src/main.js

@@ -12,7 +12,17 @@ Vue.use(VueRouter)
 const router = new VueRouter({
 	routes,
 	mode:'hash',  //路由模式
-	strict: process.env.NODE_ENV !== 'production'
+	strict: process.env.NODE_ENV !== 'production',
+	scrollBehavior (to, from, savedPosition) {
+		if(savedPosition){
+			return savedPosition
+		} else {
+			if(from.meta.keepAlive){
+				from.meta.savedPosition = document.body.scrollTop;
+			}
+			return {x:0,y:to.meta.savedPosition || 0}
+		}
+	}
 })
 
 new Vue({

src/router/router.js

@@ -61,7 +61,7 @@ export default[{
 				}
 			]
 		},			//群聊	
-		{path: '/addressbook', component: addressbook,
+		{path: '/addressbook', component: addressbook, mate:{ keepAlive: true},
 			children: [
 				{
 					path: '/addressbook/details',

src/service/getData.js

@@ -30,5 +30,5 @@ export const collect = () => setpromise(collectData.collect);		//获取收藏数
 export const burse = () => setpromise(bursetData.burse);				//获取我的钱包数据
 export const album = () => setpromise(albumData.album);				//获取我的钱包数据
 export const chatData = () => setpromise(chatmoreData.chatmore);		//获取聊天页面轮播数据
-export const login = data => fetch('/user/login', data);			//登陆
+export const login = data => fetch('/user/login', data);				//登陆
 export const getHistory = data => fetch('/chat/history', data);			//聊天记录