vue常见的报错信息如何决绝

简介: 为什么要 return 一个数据对象呢? 官方解释如下: data 必须声明为返回一个初始数据对象的函数,因为组件可能被用来创建多个实例。如果 data 仍然是一个纯粹的对象,则所有的实例将共享引用同一个数据对象!

1.Vue项目中,Cannot find module 'node-sass' 报错找不到解决方法


运行命令:cnpm install node-sass@latest  即可解决
2接口踩坑:Status (blocked:other)
原因:安装了广告拦截插件


2.出现`Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead,


use a data or computed property based on the prop's value. Prop being mutated: "showStaffList"`的错误


原因:


简单的说就是,组件内不能修改props的值


解决方法:


在子组件data中创建一个props值得副本,所有操作props值得地方都通过操作data中副本来实现,


props:{
    showPopup:{
          type:Boolean,
          default:false
    }
}
data:(){
        return {
     showMask:false
        }
}
watch:{
   showPopup(val,old){
       this. showMask = val;
    }
}


3、出现 "export 'default' (imported as 'ol') was not found in 'ol'


解决办法:


导入方式改为: import * as G2 from '@antv/g2'\
原因:动态组件无法识别第三方插件的引用,需要使用import * as 方法进行重命名


4、出现can’t not find ‘xxModule


这种情况一般报错信息可以看到是哪个包抛出的信息.,一般卸载这个模块,安装重新安装下即可


5、出现data functions should return an object


这个问题是 vue 实例内,单组件的data必须返回一个对象;如下


export default {
   name: 'list',
   data () {
       return {
           tabs: [
               {
                   title: '财务信息',
                   url: '/userinfo'
               }
           ]
       }
   }
  }

  为什么要 return 一个数据对象呢? 官方解释如下: data 必须声明为返回一个初始数据对象的函数,因为组件可能被用来创建多个实例。如果 data 仍然是一个纯粹的对象,则所有的实例将共享引用同一个数据对象!简言之,组件复用下,不会造成数据同时指向一处,造出牵一发而动全身的破问题...

相关文章
|
3天前
|
JavaScript
vue消息订阅与发布
vue消息订阅与发布
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-50.(了解)表单校验插件】
vue尚品汇商城项目-day07【vue插件-50.(了解)表单校验插件】
11 4
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【51.路由懒加载】
vue尚品汇商城项目-day07【51.路由懒加载】
12 4
|
4天前
|
JavaScript 前端开发
Vue学习笔记8:解决Vue学习笔记7中用v-for指令渲染列表遇到两个问题
Vue学习笔记8:解决Vue学习笔记7中用v-for指令渲染列表遇到两个问题
|
2天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-54.(了解)生成二维码插件】
vue尚品汇商城项目-day07【vue插件-54.(了解)生成二维码插件】
8 2
|
5天前
|
JavaScript
vue组件中的插槽
本文介绍了Vue中组件的插槽使用,包括单个插槽和多个具名插槽的定义及在父组件中的使用方法,展示了如何通过插槽将父组件的内容插入到子组件的指定位置。
|
4天前
|
JavaScript 前端开发 IDE
Vue学习笔记5:用Vue的事件监听 实现数据更新的实时视图显示
Vue学习笔记5:用Vue的事件监听 实现数据更新的实时视图显示
|
4天前
|
JavaScript 前端开发 API
Vue学习笔记4:用reactive() 实现数据更新的实时视图显示
Vue学习笔记4:用reactive() 实现数据更新的实时视图显示
|
4天前
|
JavaScript 前端开发 API
Vue学习笔记7:使用v-for指令渲染列表
Vue学习笔记7:使用v-for指令渲染列表
|
4天前
|
JavaScript
vue 函数化组件
vue 函数化组件