Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/401.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在react应用程序中无法将对象转换为基元值错误?_Javascript_Jquery_Reactjs_Bootstrap 4 - Fatal编程技术网

Javascript 在react应用程序中无法将对象转换为基元值错误?

Javascript 在react应用程序中无法将对象转换为基元值错误?,javascript,jquery,reactjs,bootstrap-4,Javascript,Jquery,Reactjs,Bootstrap 4,我正在开发一个简单的react spring启动应用程序,但由于GitHub问题,我使用IntelliJ重新创建了应用程序启动程序文件,并使用以前应用程序的package.json文件的依赖项数据安装了节点模块 如果我使用折叠导航栏(hamburger bar-->响应导航栏,在移动视图中折叠)并单击hamburger按钮查看导航链接,则会出现以下错误。但在之前的应用程序中,所有这些都进行得很顺利 TypeError: Cannot convert object to primitive val

我正在开发一个简单的react spring启动应用程序,但由于GitHub问题,我使用IntelliJ重新创建了应用程序启动程序文件,并使用以前应用程序的package.json文件的依赖项数据安装了节点模块

如果我使用折叠导航栏(hamburger bar-->响应导航栏,在移动视图中折叠)并单击hamburger按钮查看导航链接,则会出现以下错误。但在之前的应用程序中,所有这些都进行得很顺利

TypeError: Cannot convert object to primitive value
HTMLDivElement.<anonymous>
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/js/src/collapse.js:346
  343 |   ...typeof config === 'object' && config ? config : {}
  344 | }
  345 | 
> 346 | if (!data && _config.toggle && /show|hide/.test(config)) {
      | ^  347 |   _config.toggle = false
  348 | }
  349 | 
View compiled
Function.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:381
  378 | if ( isArrayLike( obj ) ) {
  379 |     length = obj.length;
  380 |     for ( ; i < length; i++ ) {
> 381 |         if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
      | ^  382 |            break;
  383 |         }
  384 |     }
View compiled
jQuery.fn.init.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:203
  200 | 
  201 | // Execute a callback for every element in the matched set.
  202 | each: function( callback ) {
> 203 |     return jQuery.each( this, callback );
      | ^  204 | },
  205 | 
  206 | map: function( callback ) {
View compiled
jQuery.fn.init._jQueryInterface [as collapse]
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/js/src/collapse.js:337
  334 | }
  335 | 
  336 | static _jQueryInterface(config) {
> 337 |   return this.each(function () {
      | ^  338 |     const $this   = $(this)
  339 |     let data      = $this.data(DATA_KEY)
  340 |     const _config = {
View compiled
HTMLDivElement.<anonymous>
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/js/src/collapse.js:385
  382 |     const $target = $(this)
  383 |     const data    = $target.data(DATA_KEY)
  384 |     const config  = data ? 'toggle' : $trigger.data()
> 385 |     Collapse._jQueryInterface.call($target, config)
  386 |   })
  387 | })
  388 | 
View compiled
Function.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:381
  378 | if ( isArrayLike( obj ) ) {
  379 |     length = obj.length;
  380 |     for ( ; i < length; i++ ) {
> 381 |         if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
      | ^  382 |            break;
  383 |         }
  384 |     }
View compiled
jQuery.fn.init.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:203
  200 | 
  201 | // Execute a callback for every element in the matched set.
  202 | each: function( callback ) {
> 203 |     return jQuery.each( this, callback );
      | ^  204 | },
  205 | 
  206 | map: function( callback ) {
View compiled
HTMLButtonElement.<anonymous>
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/js/src/collapse.js:381
  378 | const selector = Util.getSelectorFromElement(this)
  379 | const selectors = [].slice.call(document.querySelectorAll(selector))
  380 | 
> 381 | $(selectors).each(function () {
      | ^  382 |   const $target = $(this)
  383 |   const data    = $target.data(DATA_KEY)
  384 |   const config  = data ? 'toggle' : $trigger.data()
View compiled
HTMLDocument.dispatch
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:5428
  5425 | event.handleObj = handleObj;
  5426 | event.data = handleObj.data;
  5427 | 
> 5428 | ret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle ||
       | ^  5429 |  handleObj.handler ).apply( matched.elem, args );
  5430 | 
  5431 | if ( ret !== undefined ) {
View compiled
HTMLDocument.elemData.handle
C:/Users/Hasindu/Documents/AF/Application Frameworks/online-fashion-store-master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:5232
  5229 | 
  5230 |        // Discard the second event of a jQuery.event.trigger() and
  5231 |        // when an event is called after a page has unloaded
> 5232 |        return typeof jQuery !== "undefined" && jQuery.event.triggered !== e.type ?
       | ^  5233 |          jQuery.event.dispatch.apply( elem, arguments ) : undefined;
  5234 |    };
  5235 | }
View compiled
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.  Click the 'X' or hit ESC to dismiss this message.```
TypeError:无法将对象转换为基元值
HTMLDivelment。
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/js/src/collapse.js:346
343 |…配置的类型=='object'&&config?配置:{}
344 | }
345 | 
>346 | if(!data&&&u config.toggle&&/show | hide/.test(config)){
|^347 |_config.toggle=false
348 | }
349 | 
视图编译
功能。每个
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:381
378 | if(类似于isArrayLike(obj)){
379 |长度=物体长度;
380 |表示(;i381 | if(callback.call(obj[i],i,obj[i])==false){
|^382 |中断;
383 |         }
384 |     }
视图编译
jQuery.fn.init.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:203
200 | 
201 |//对匹配集中的每个元素执行回调。
202 |每个:函数(回调){
>203 |返回jQuery.each(此为回调);
| ^  204 | },
205 | 
206 |映射:函数(回调){
视图编译
jQuery.fn.init.\u jQueryInterface[as collapse]
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/js/src/collapse.js:337
334 | }
335 | 
336 |静态_jQueryInterface(配置){
>337 |返回此。每个(函数(){
|^338 | const$this=$(this)
339 | let data=$this.data(data_键)
340 |常数_配置={
视图编译
HTMLDivelment。
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/js/src/collapse.js:385
382 | const$target=$(此)
383 | const data=$target.data(数据_键)
384 | const config=data?'toggle':$trigger.data()
>385 | Collapse._jQueryInterface.call($target,config)
386 |   })
387 | })
388 | 
视图编译
功能。每个
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:381
378 | if(类似于isArrayLike(obj)){
379 |长度=物体长度;
380 |表示(;i381 | if(callback.call(obj[i],i,obj[i])==false){
|^382 |中断;
383 |         }
384 |     }
视图编译
jQuery.fn.init.each
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:203
200 | 
201 |//对匹配集中的每个元素执行回调。
202 |每个:函数(回调){
>203 |返回jQuery.each(此为回调);
| ^  204 | },
205 | 
206 |映射:函数(回调){
视图编译
HTMLButtoneElement。
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/js/src/collapse.js:381
378 | const selector=Util.getSelectorFromElement(此)
379 |常量选择器=[].slice.call(document.querySelectorAll(选择器))
380 | 
>381 |$(选择器)。每个(函数(){
|^382 | const$target=$(此)
383 | const data=$target.data(数据_键)
384 | const config=data?'toggle':$trigger.data()
视图编译
HTMLDocument.dispatch
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:5428
5425 | event.handleObj=handleObj;
5426 | event.data=handleObj.data;
5427 | 
>5428 | ret=((jQuery.event.special[handleObj.origType]|{}).handle||
|^5429 | handleObj.handler)。应用(matched.elem,args);
5430 | 
5431 |如果(ret!==未定义){
视图编译
HTMLDocument.elemData.handle
C:/Users/Hasindu/Documents/AF/Application Frameworks/online fashion store master/src/main/webapp/front-end/node_modules/jquery/dist/jquery.js:5232
5229 | 
5230 |//放弃jQuery.event.trigger()的第二个事件,并
5231 |//在页面卸载后调用事件时
>5232 |返回jQuery!=“未定义”&&jQuery.event.triggered!==e.type?
|^5233 | jQuery.event.dispatch.apply(元素、参数):未定义;
5234 |    };
5235 | }
视图编译
此屏幕仅在开发过程中可见。如果应用程序在生产过程中崩溃,则不会显示此屏幕。
打开浏览器的开发人员控制台以进一步检查此错误。单击“X”或按ESC键可取消此消息```

我在开发的rails 6项目中遇到了同样的问题。我使用的是bootstrap 4.4.1,在折叠导航栏时遇到了完全相同的问题:导航栏会折叠,但折叠时出现的汉堡按钮无法单击

解决方案:将jquery从3.5.0降级到3.4.1。目前我没有调查错误的实际原因


要添加更多详细信息,jquery版本应该在
package.json
依赖项中更新,并且不要忘记运行
warn install——在执行此操作后检查文件以应用更改。

这与
jquery 3.5.0相关。
这是一个破坏性的更改,会影响许多插件。暂时恢复到以前的版本
jQuery的ious版本(如3.4.1)
为我解决了这个问题

找到Jquery包
npm install jquery@~3.4.1
npm remove jquery
npm install jquery@~3.4.1
npm install jquery@3.5.0
"resolutions": { "jquery": "3.4.1" },
"jquery": "^3.4.1",
"jquery": "3.4.1"