vue中全局socket及路由不跳转带参数刷新页面和trycatch事务管理

一.使用vue出现的bug和已经实现的功能
1.反复在公共组件中调用同一个component组件并且需要传值刷新时（就是路由地址不变，根据不同传值刷新）
（1）引入一个utils.js内容如下

import Vue from 'vue'
export default new Vue

（2）在需要跳转的页面和公共页面引入utils

import utils from '../../../Base/utils.js';

（3）公共页面如下代码：

 this.$router.push({name: "operate", path: "/operate", params: {bh: row.bh}});//解决路由跳转问题operate是路由，bh: row.bh是需要穿的值可穿多个

（4）刷新页面如下代码：

		mounted(){///解决路由跳转问题
            utils.$on('operate',bh=>{
                this.getTitleContentData(bh);//刷新页面的方法以及值
            });
        },
        
        beforeDestroy () {//防止累计请求次数主次增加
            utils.$off('operate')
        },

2.socket在vue中全局使用（此处是借鉴网上一大佬的vue全局socket设置改装而成）
（1）首先引入一个js文件如下：

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);

export default new Vuex.Store({
    state: {
        websock: null,
        eventlist:[],
    },
    getters: {
        onEvent(state) {
            return function (a) {//触发回执事件
                //console.log(state.eventlist.toString());
                a=state.eventlist;
                return a;
            }
        }
    },
    mutations: {
        WEBSOCKET_INIT(state,url) {
            state.websock = new WebSocket(url);
            state.websock.onopen = function () {
                console.log("连接成功！");
            };
            state.websock.onmessage = function (callBack) {
            console.log("ws接收！");
            var datas=callBack.data;//接收到的后端信息
            var datasList=[];//分割后的集合
            datasList=datas.split('#');
            state.websock.onerror=function(e) { //错误
                console.log("ws错误!");
                console.log(e);
            };
            state.websock.onclose=function(e) { //关闭
                console.log("ws关闭！");
                console.log(e);
            };
            state.websock.binaryType = "arraybuffer";
            state.eventlist=datasList;
            }
        },
        WEBSOCKET_SEND(state, p) {
            console.log("ws发送！");
            console.log(JSON.stringify(p.data.msg));
            state.websock.send(JSON.stringify(p.data.msg));//发送消息
        }
    },
    actions: {
        WEBSOCKET_INIT({commit},url) {
            commit('WEBSOCKET_INIT',url)
        },
        WEBSOCKET_SEND({commit}, p) {
            p.type=3;
            commit('WEBSOCKET_SEND', p)
        }
    }
})

（2）在main.js中配置如下

import websocket from './Base/webSocketStore.js'

Vue.prototype.$websocket = websocket;

（3）在登陆后初始化socket

this.$websocket.dispatch('WEBSOCKET_INIT',"ws://localhost:8080/项目名/后台的socket地址");//基于http协议如果https需要换成wss开头且需要域名

（4）调用后台像前台发送主动推送信息

		computed:{
            alertCont() {//socket连接给socket连接事件加一个处理
                return this.$websocket.getters.onEvent('ConnectByJson.C');
            }
        },
        watch: {
            alertCont: function (a) {//监听socket调用方法
                if(a[0]=="netorder"){
                    this.getTitleContentData(a[1]);//此处调用刷新
                }
            }
        },

//像后端推送信息
				var data = {//数据json对象
                    msg:12312312,
                };
                var method="proxy.ConnectByJson";
                this.$websocket.dispatch("WEBSOCKET_SEND",{
                    method:method,
                    jsonData:jsonData,
                });

二.设置service手动回滚
1.当多个mapper在service中被调用且在逻辑代码中trycatch的时候，我们需要手动回滚。因为该类的异常并没有抛出，就不是触发事务管理机制，只需在如下添加代码：

try {
			逻辑代码
			if(a!=1||b!=1) {
				return ReturnDataUtils.getFailCode(ErrorCodeUtil.NMOPT_DATAFAIL);
			}
			//这一行就是手动回滚的代码
			WebSocketHandler.sendMessageToUsers(new TextMessage("netorder#"+bh+"#w"));
		} catch (Exception e) {
			e.printStackTrace();
			TransactionAspectSupport.currentTransactionStatus().setRollbackOnly();
			return ReturnDataUtils.getFailCode(ErrorCodeUtil.NMOPT_OPERFAIL);
		}

如果你的service名称没有配到aop中可以在service中添加如下注释

@Transactional(rollbackFor=Exception.class)//表示所有异常都会走事务