开头一句mmp

tmd换位置了也没个提示!!!!

坑死爹了

<template>
<div>
<input type="text" v-model="text">
<button @click="sendMessage">发送消息</button>
<br>
<br>
<div>{{data}}</div>
</div>
</template>
<script>
import SockJS from 'sockjs-client'
import Stomp from 'webstomp-client'
export default {
name: 'ChatRoom',
data () {
return {
text: '',
data: '',
stompClient: null
}
},
mounted () {
if ('WebSocket' in window) {
this.initWebSocket()
} else {
alert('当前浏览器 Not support websocket')
}
},
methods: {
sendMessage () {
this.stompClient.send('/app/hello', JSON.stringify(this.text), {})
},
initWebSocket () {
this.connection()
},
connection () {
const socket = new SockJS(this.$baseUrl + '/chat')
this.stompClient = Stomp.over(socket)
this.stompClient.connect({}, (frame) => {
this.stompClient.subscribe('/topic/greetings', (greeting) => {
console.log(JSON.parse(greeting.body))
})
})
}
}
}
</script> <style scoped> </style>

重点是{}参数放最后面!!!!!

哎我擦

接口代码:

package org.just.computer.mathproject.Controller.WebSocket;

import org.just.computer.mathproject.Bean.Message;
import org.springframework.messaging.handler.annotation.MessageMapping;
import org.springframework.messaging.handler.annotation.SendTo;
import org.springframework.stereotype.Controller; import java.security.Principal; @Controller
public class GreetingController {
@MessageMapping("/hello")
@SendTo("/topic/greetings")
public Message greeting(String content, Principal pl) throws Exception{
Message message = new Message();
message.setContent(content);
message.setName(pl.getName());
return message;
}
}

Vue Stomp+SocketJS 数据报错[Object object]的更多相关文章

  1. Vue的报错:Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

    Vue的报错:Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>' ...

  2. Vue报错:Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#<Object>‘的解决方法

    发现问题 运行一下以前的一个Vue+webpack的 vue仿新闻网站  小项目,报错 由于自己vue学习不深入,老是这个报错,找了好久(确切的说是整整一下午^...^)才找到原因 -v- Uncau ...

  3. Vue 使用自定义组件时报错:Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

    自己试做了一下vue的插件 参考element-ui: 写了一个组件 import message from './packages/message/index.js'; const install ...

  4. vue运行报错error:Cannot assign to read only property 'exports' of object '#<Object>'

    用weex做项目的时候,npm start 之后一直报错error:Cannot assign to read only property 'exports' of object '#<Obje ...

  5. Vue不兼容IE8原因以及Object.defineProperty详解

    Vue不兼容IE8原因以及Object.defineProperty详解 原因概述: Vue.js使用了IE8不能模拟的ECMAScript5特性. Vue.js支持所有兼容ES5的浏览器. Vue将 ...

  6. 在Vue中使用i18n 国际化遇到 Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

    最近用Vue在搭建前端框架,在引用i18n时,运行的时候报错:Uncaught TypeError: Cannot assign to read only property 'exports' of ...

  7. oracle创建包后执行报错:object omgmig.test_package is invalid.

    今天学习了一下oracle的包的写法,然后碰到这么个问题.包声明和包主体都正确,但是就是执行报错:object omgmig.test_package is invalid. 这是会报错的sql,看起 ...

  8. 安装Django时报错'module' object has no attribute 'lru_cache'

    使用pip方法安装Django时报错'module' object has no attribute 'lru_cache' 解决办法如下 命令行输入命令sudo pip install Django ...

  9. python报错'str' object is not callable

    >>> x=1.235 >>> int(x) 1 >>> str="fsgavfdbafdbntsbgbt" >> ...

随机推荐

  1. 使用android日志工具

    Log的级别? 日志级别按照高低排序为:ERROR,WARN,INFO,DEBUG,VERBOSE, 日志输出: Log.e()输出ERROR级别的日志信息 Log.w()输出WARN,ERROR级别 ...

  2. Linux中IP配置

    一.获取网卡名称 ip a ifconfig(安装net-tools后可用) 二.进入网卡配置文件所在路径 cd /etc/sysconfig/network-scripts/ 三.编辑网卡配置文件 ...

  3. redis和memcached的对比

    redis:① 支持的数据结构比较多 ② 支持集群 ③ 支持数据持久化,RDB.AOF ④ 单个value最大值512MB      ⑤ 单核 memcached: ① 支持K/V结构的数据 ② 不支 ...

  4. Django框架(二十二)-- Django rest_framework-解析器

    一.解析器的作用 根据请求头 content-type 选择对应的解析器对请求体内容进行处理,将传过来的数据解析成字典 二.使用解析器 1.局部使用 在视图类中重定义parser_classes即可, ...

  5. char数据类型

    char数据类型就是为了中文 一个中文占两个字节正好char是占用两个字节 char a='国'’; char类型必须使用单引号属于字符类型 双引号的是字符串类型如果使用等号两边数据类型不一致就是 不 ...

  6. 第十五周博客作业 <西北师范大学| 周安伟>

    第十五周作业 助教博客链接https://home.cnblogs.com/u/zaw-315/ 作业要求链接https://www.cnblogs.com/nwnu-daizh/p/10946673 ...

  7. grub2详解

    本文主要介绍的是grub2,在文末对传统grub进行了简述,但在grub2的内容部分中包含了很多grub2和传统grub的对比. 如果仅仅是想知道grub2中的boot.img/core.img/di ...

  8. [C2P2] Andrew Ng - Machine Learning

    ##Linear Regression with One Variable Linear regression predicts a real-valued output based on an in ...

  9. LG5536 「XR-3」核心城市 树的直径

    问题描述 LG5536 题解 两次 \(\mathrm{dfs}\) 求树的直径. 然后找到树的直径的中点. 然后按照 子树中最深的点深度-自己深度 排序,贪心选取前 \(k\) 个. \(\math ...

  10. 通过channel实现同步和数据交互

    package main import ( "fmt" "time" ) func main(){ //创建channel ch := make(chan st ...