Vue JS 在 console.log 上返回 [Object object] 在 JSON.parse 上返回 Undefined

     2023-02-22     156

关键词:

【中文标题】Vue JS 在 console.log 上返回 [Object object] 在 JSON.parse 上返回 Undefined【英文标题】:Vue JS returning [Object object] on console.log and Undefined on JSON.parse 【发布时间】:2020-04-12 16:05:15 【问题描述】:

所以我正在编写这个 Vue.JS 代码来显示 PHP 从服务器获取的数据。 PHP 向 Vue 返回一个 JSON 对象,而 VUE 必须显示它。我当前的代码是:

  axiosPost();

function axiosPost()

 axios.post(
  './ConversationGetter.php',
  
    function2call: 'getRecord',
    id: 1,
    access: this.accesstoken
  

)
.then(response =>  this.data=response.data;
console.log(response.data);
console.log("Response From VUE JS"+this.data);

)
.catch(error => );

问题是,首先console.log 正确打印响应数据。但是第二个console.log 显示的是这个:

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

如果我在显示数据时使用 JSON.parse,它会显示:

undefined

【问题讨论】:

可以发布response.data的内容吗? 是的。给我一秒钟。 因为 console.log('some string' + [someObject, someObject, etc]) 将 this.data 中的对象数组强制为字符串数组,而字符串对象变为 'object Object' - 即忽略第二个 console.log,它是完全符合预期,数据是正确的 - 使用 console.log('some string', [someObject, someObject, etc]) ... 注意 , 而不是 + ... 您的 console.log 将是您最初所期望的 @PrabhjotSinghKainth - 内容完全不相关 你可以使用 JSON.stringify() 【参考方案1】:

"+" 运算符在第二个控制台语句中转换为字符串。请改成","如下?

console.log("Response From VUE JS", this.data);

【讨论】:

【参考方案2】:

您不需要JSON.parse .. 直接使用response.data。如果您想查看实际数据,请使用console.log(JSON.stringify(response.data))

【讨论】:

JSON.stringify 仍然返回 [Object object] 如果这是一个 webapi 响应,您可以在浏览器的网络选项卡中查看结构以检查响应结构或只是 console.log(response.data)

vue生产环境清除console.log

npmrunbuild后的生产环境的代码,会有很多开发时留下的console.log(),不可能每个页面不停地删除在build/webpack.prod.conf.js文件里加上这样一段代码即可newwebpack.optimize.UglifyJsPlugin({compress:{warnings:false,     drop_debugger:true,//++drop_conso... 查看详情

Console.log 在 Vue js watcher 中被调用两次

】Console.log在Vuejswatcher中被调用两次【英文标题】:Console.loggettingcalledtwiceinVuejswatcher【发布时间】:2020-05-2421:36:32【问题描述】:我正在尝试为测验创建一个计时器。计时器是从API输出中获得的,以秒为单位。我正在使用Vuex来... 查看详情

用console.log分析vue源码(代码片段)

前言本文通过console.log的一些特性,结合vue.js的源码,通过一个简单的例子,让你了解Vue的各个过程的变化.控制台输出的效果图请用chrome查看,并打开控制台看效果演示地址准备vue-console.html的创建下载vue.js文件,在vue-console.html中引入,... 查看详情

console.log(myFunction()) 返回未定义

】console.log(myFunction())返回未定义【英文标题】:console.log(myFunction())returnsundefined【发布时间】:2018-06-2922:59:54【问题描述】:我是JavaScript新手,我尝试使用它来了解所有内容。我写functiongreet()console.log("Hi");;console.log(greet());它在... 查看详情

如何在 Vue.js 中使用 async/await?

...我想在Vue.js中使用async/await这是我的代码created()this.getA()console.log(2)this.getB(),methods:getA()console.log(1),getB()console.log 查看详情

在 vue js 上观看路由对象

...对象?这是我的代码watch:\'$route.params.search\':function(search)console.log(search)它不起作用。我尝试使用deep仍然无法处理here查看代码sanbox,您可以查看main.js上的路由对象。您 查看详情

js判断一个元素是否在数组中(代码片段)

1.比较传统的做法:概述:  indexOf()方法返回给定元素能找在数组中找到的第一个索引值,否则返回-1。vara=["1","3","2","3","0"];console.log(a.indexOf(‘3‘));//1console.log(a.indexOf(5,‘0‘));//-1console.log(a.indexOf(‘0‘));//4console.log( 查看详情

如何在 vue.js 2 上循环对象观察者?

...e.js2?【发布时间】:2018-05-0310:30:12【问题描述】:如果我console.log(this.list),结果是这样的:this.list.forEach(function(user)selected.push(user.id););存在错误:未捕获的类型错误:this.list.forEach不是函数我 查看详情

node.js 的 console.log 是异步的吗?

】node.js的console.log是异步的吗?【英文标题】:isnode.js\'console.logasynchronous?【发布时间】:2011-07-0421:27:01【问题描述】:node.js中的console.log/debug/warn/error是异步的吗?我的意思是javascript代码执行会停止直到内容打印到屏幕上,还... 查看详情

谷歌地图:函数返回未定义的值在 console.log 中工作正常

】谷歌地图:函数返回未定义的值在console.log中工作正常【英文标题】:GoogleMaps:functionreturnsundefinedvalueworksfineinconsole.log【发布时间】:2016-05-1107:50:11【问题描述】:我正在尝试返回lat,lon的地址,它在console.log上打印数组,但在... 查看详情

打包优化去掉console.log,webpack.js配置排除打包瘦身

...#39;).tap((args)=>   args[0].terserOptions.compress.drop_console=true   returnargs  )通过配置vue-cli把一些平常不需要用的包排除在打包文件之外。例如:让webpack不打包vuexlsx和element 先找到vue.config.js,添加externals... 查看详情

js—数组方法总结(代码片段)

...长度。注意,该方法会改变原数组。1vararr1=[10111,1101,111];2console.log(arr1.push(100));//4返回数组长度3console.log(arr1);//[10111,1101,111,100]   (2)pop():删除数组的最后一个元素,并返回该元素。注意,该方法会改变原数组。2、(1... 查看详情

vue项目如何在移动端查看打印日志(console.log)

...也不知道问题出在哪里,后来找到了一个好用的插件:vConsole。1.安装npminstallvconsole2、在main.js中引入importVconsolefrom‘vconsole‘;letvConsole=newVconsole();exportdefaultvConsole编译你的vue项目,用移动端打开项目就可以看到绿色的vconsole图标&n... 查看详情

Vue CLI 3 使用 Terser 删除 console.log 和代码注释

】VueCLI3使用Terser删除console.log和代码注释【英文标题】:VueCLI3removeconsole.logandcodecommentswithTerser【发布时间】:2020-02-0700:17:32【问题描述】:我正在使用VUECLI3,我需要从构建的产品中删除console.log和codecmets。这是我的Terser设置:we... 查看详情

vue对象的生命周期

...newVue(el:"#app",data:num:10,,beforeCreate()//vm对象创建执行的方法console.log("vm对象创建之前");console.log(this.$el);console.log(this.$num);,created()//vm对象创建以后执行的方法console.log("vm对象创建之后");console.log(this.$el);//此时vm对象还没用初始化完... 查看详情

vue3.0中console.log报错

ModuleWarning(from./node_modules/eslint-loader/index.js):error:Unexpectedconsolestatement(no-console)at这个错误是Vuejs-使用ESLint检查代码质量是进行提示的,修改成以下方式解决:window.console.log(res);  查看详情

vue_如何判断变量是数组还是对象(代码片段)

...sp;一、typeof判断数据类型(判断数组跟对象都返回object)console.log(typeofnull);//"object"console.log(typeoffunction()return1;);//"function"console.log(typeof‘梦龙小站‘);//"string"console.log(typeof1);//"number"console.log(typeofa);//"undefined"console.log(typeofundefined)... 查看详情

Console.log 总是在 Chrome 中返回 undefined [重复]

】Console.log总是在Chrome中返回undefined[重复]【英文标题】:Console.logalwaysreturnsundefinedinChrome[duplicate]【发布时间】:2019-03-1921:51:41【问题描述】:我刚刚遇到了这个奇怪的问题。我不记得我以前有过它,但自从我上次开发任何Chrome... 查看详情