Vue项目报错：[Vue warn]: data functions should return an object

于 2024-04-01 14:28:21 发布
阅读量220 收藏
点赞数 3
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/aaa_12as/article/details/137228571
版权

练习vue组件传值时，报了一个错：[Vue warn]: data functions should return an object，不到一分钟解决了，觉得对新手学习可能有帮助，就把解决方案分享出来。

1.components目录下新建了两个页面：Father.vue和Son.vue

2.父组件页面

3.子组件页面

4.浏览器中显示

5.控制台报错：[Vue warn]: data functions should return an object

6.在子组件中，我们发现，data函数中没有加return，由于data函数需要返回一个对象，所以必须加上return {}，这样就不会报错了

aaa_12as
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue 报错data functions should return an object:
Lee的博客
03-08 2万+
先上图 报错原因是vue对象中的data属性没有return{};
Vue项目报错：Uncaught SyntaxError: Unexpected token <
10-17
主要介绍了Vue项目报错：Uncaught SyntaxError: Unexpected token <，在引入第三方依赖的 JS 文件时，遇到的一个问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
[Vue warn]: data functions should return an object:
m0_57275939的博客
05-26 1万+
    在引入新的vue组件时，可能出现以下错误     data functions should return an object 意思是 “数据函数应返回一个对象”，错误位置为 CommonForm.vue 这个文件   错误原因为：在 vue 组件中即使没有任何参数也需要添加 return{} 返回值，如果不加上则当前组件的数据会变成全局可视，则造成变量污染。加上 return{} 则组件数据只能当前组件可视，不会影响到其他组件 错误代码: <script> export def
vue 报错 data functions should return an object: 和 Cannot read property '__ob__' of undefined
xiamoziqian的博客
10-25 431
在vue里出现data functions should return an object: 和 Cannot read property ‘ob’ of undefined 报错是因为在 data () {},里没有返回(return) 需要写成 data(){ return{ } } 就算没有数据也要写返回一个对象 (return) 版权声明：本文为CSDN博主「L时光」的原创...
【Vue】报错：data functions should return an object:
DomCode
08-24 752
初学者在写项目的时候可能会遇到这样的情况 遇到此情况是因为你项目中的export default中data缺少一个属性return 如图所示: 加了之后报错就没有了
Vue项目报错：Uncaught SyntaxError: Unexpected token
01-19
今天做一个 VUE 的项目，在引入第三方依赖的 JS 文件时，遇到了一个问题： 控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 index.html 文件,发现原本我...
解决vue打包后刷新页面报错：Unexpected token <
10-16
主要介绍了解决vue打包后刷新页面报错：Unexpected token <相关知识点，需要的朋友们参考下。
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
在Vue.js框架中，`this.$set`是一个用于添加响应式属性的方法，它遵循Vue的依赖追踪机制，确保新添加的属性能够触发视图更新。然而，当你遇到`TypeError: this.$set is not a function`的错误时，通常是因为`this`上...
解决vue net :ERR_CONNECTION_REFUSED报错问题
10-14
本文将重点讲解如何解决Vue项目中出现的这个报错问题。 首先，我们分析错误产生的原因。在提供的描述中，作者提到是因为频繁更换网络环境，导致需要在`package.json`的`dev`脚本中更改`--host`参数。在开发过程中，...
解决vue打包后刷新页面报错：Unexpected token
12-12
今天遇到了一个很怪的问题，在vue-cli+webpack的项目中，刷新特定页面后页面会变空白，报错为index.html文件中Unexpected token <。 怪点一是开发环境没有问题，只有生产环境有问题，怪点二是只有一个页面有问题...
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
10-14
在开发Vue项目时，遇到IE11浏览器白屏并报出`SCRIPT1002: 语法错误`的问题，通常是由于IE11不支持ES6语法导致的。Vue.js自身和许多现代JavaScript库广泛使用了ES6特性，而IE11并不完全支持这些新特性。以下是一些...
解决vue项目报错webpackJsonp is not defined问题
10-18
下面小编就为大家分享一篇解决vue项目报错webpackJsonp is not defined问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Vue项目实战：接口错误拦截与环境设置
01-20
在Vue项目中，接口错误拦截和环境设置是两个重要的实践环节，它们对于项目的稳定性和用户体验有着直接影响。本文将详细介绍这两个方面，并提供相应的代码示例。 首先，我们来看接口错误拦截。在开发过程中，经常会...
Vue报错：[Vue warn]: data functions should return an object:
just a moment
05-21 1110
报错显示： 报错原因是vue对象中的data属性没有return{}： export default { data() { return; { msg: "hiiii,cici"; } },``` 改成： ```javascript export default { data() { return{ msg: "hiiii,cici", } }, ...
data functions should return an object:
刘小杨的博客
08-16 2171
Vue中的props
【bug】data functions should return an object
花椒和蕊的博客
09-27 5448
也就是传参的bill，如果键和值一样，可以简写为bill，但是因为这行注掉了，导致bill没有值，所以报没有返回一个对象的错。点击保存的时候报的错，保存前要校验表单，然后调接口传参，传参是表单对象和列表数组分开传。遇到bug可以断点或者console打印，一步一步排查点击保存后是走到哪里开始报错的。我报错的原因是有一行代码被我注掉了，可能是改别的东西的时候，误以为无用。知道原因都很好解决，最怕不知道bug是什么原因引起的。但我遇到的报错不是这个原因引起的。
[Vue warn][data functions should return an object]
热门推荐
墨水白云的博客
05-18 2万+
翻译内容：data方法必须要返回一个对象 原因： 忘记加return了，因此改为如下： 问题：为什么data必须是一个方法返回而不像method一样只是一个属性? 直接作用：通过data方法返回的形式可以保证每个组件的数据独立性，即相互之间不会出现干扰。 原理：函数的作用域概念 官方解释：https://cn.vuejs.org/v2/guide/components.html ...
Vue warn]: data functions should return an object:
最新发布
06-07
这个警告通常是因为 Vue 的组件的 data 选项不是一个函数，而是一个对象。在 Vue 中，data 选项必须是一个函数，这个函数返回一个对象，而不是一个对象本身。 如果您的组件中的 data 选项是一个对象，请将其改为一...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值