vue中使用mui中的滑动组件时报错TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed

原

vue中使用mui中的滑动组件时报错TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed

置顶 2019年02月09日 17:13:37 Lorin丶 阅读数 1844 标签： vue mui滑动组件 webpack非严格模式

Uncaught TypeError: ‘caller’, ‘callee’, and ‘arguments’ properties may not be accessed on strict mode functions or the arguments objects for calls to them

---

出现这个报错是因为mui中的tab-top-webview-main 滑动组件中的js，使用了非严格模式的语法，然而在webpack打包中默认使用了严格模式去打包

---

---

解决方法：

1.一号坑：取消掉webpack默认的严格模式打包：

下载：

npm install babel-plugin-transform-remove-strict-mode

在bablerc文件中 添加：“plugins”:

{
	"plugins": ["transform-remove-strict-mode"]
}

       
       
       
       

       
       
       
       

        
        
        
        
1
        
        
        
        
2
        
        
        
        
3
       
       
       
       

---

2.使用mui中的横向滑动组件: tab-top-webview-main

注意：二号坑 取消掉第一个div#slider 的fullscreen样式，否则会以全屏展示

				

					

						
							推荐
						
						
							热点
						
						
							北京
						
						
							社会
						
						
							娱乐
						
					
				
		</div>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23

---

3.三号坑 在mounted钩子函数中初始化，因为这个组件需要获取DOM元素，而mounted是在页面挂载完成后执行的生命周期函数，所以在此时执行初始化的时机是比较合适的

（如果在mounted之前的生命周期函数中初始化，会出现一个问题：进入这个滑动组件的页面时，第一次无法滚动，刷新之后又可以正常滚动了）

   
   
   
   

   
   
   
   

    
    
    
    
1
    
    
    
    
2
    
    
    
    
3
    
    
    
    
4
    
    
    
    
5
    
    
    
    
6
    
    
    
    
7
    
    
    
    
8
    
    
    
    
9
    
    
    
    
10
   
   
   
   

---

4.四号坑 到此为止虽然可以使用了，但是还有一个问题，在谷歌浏览器中会报警告，因为谷歌自己弄了一个什么东西我也不太清楚，反正冲突了(也不是很严重，不解决也不会怎么样，如果强迫症的话还是解决掉吧)，解决方案是给全局加上一个样式：

* {
		touch-action: pan-y;
	}

   
   
   
   

   
   
   
   

    
    
    
    
1
    
    
    
    
2
    
    
    
    
3
   
   
   
   

---

5.**五号坑**：