반응 응용 프로그램에서 객체를 기본 값 오류로 변환 할 수 없습니까?


27

간단한 반응 스프링 부트 응용 프로그램을 개발하고 있지만 GitHub 문제로 인해 IntelliJ를 사용하여 응용 프로그램 시작 파일을 다시 만들고 이전 응용 프로그램의 package.json 파일의 종속성 데이터를 사용하여 노드 모듈을 설치했습니다.

접는 탐색 표시 줄 (햄버거 표시 줄-> 모바일보기에서 축소되는 반응 형 탐색 표시 줄)을 사용하고 햄버거 단추를 클릭하면 탐색 표시 줄 링크가 표시되어 아래 오류가 발생합니다. 그러나 그 모든 것은 이전 응용 프로그램에서 잘 진행되었습니다.

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 browsers developer console to further inspect this error.  Click the 'X' or hit ESC to dismiss this message.```

오늘 바로이 오류가 발생하기 시작했습니다. 새로운 버전의 릴리스에서 이상한 점인지 궁금하십니까?
matgargano

답변:


55

먼저 jQuery를 제거하십시오.

npm remove jquery

그런 다음 다시 설치하십시오.

npm install jquery@~3.4.1

이것은 나를 위해 그것을 고쳤다. 나는 무슨 일이 일어 났는지 궁금해하기 위해 한 시간을 보냅니다. :( 대단히 감사합니다!
DaveK

감사합니다.이 문제를 해결하기 위해 마지막으로 한 것과 동일합니다.
Hasindu Dahanayake

1
공감했지만 다시 시작 / 다시 작성하는 데 필요한 것을 추가하고 싶습니다. 어느 npm run dev하거나 다시 다시 시작하고 npm run watch.
Veljko Stefanovic

24

나는 개발중인 rails 6 프로젝트에서 같은 문제를 겪었다. 부트 스트랩 4.4.1을 사용하고 있으며 축소 탐색 표시 줄과 똑같은 문제가 발생했습니다. 탐색 표시 줄이 접히지 만 축소시 나타나는 햄버거 버튼을 클릭 할 수 없었습니다.

해결책 : jquery를 3.5.0에서 3.4.1로 다운 그레이드하십시오. 나는 현재 오류의 실제 이유를 조사하지 않았습니다.

자세한 내용을 추가하려면 jquery 버전을 package.json종속성 으로 업데이트해야하며 yarn install --check-files변경 사항을 적용하려면이 작업 을 수행 한 후에 실행하는 것을 잊지 마십시오.


나는 현재 JQuery와 3.4.1 사용하고 있습니다
Hasindu Dahanayake

그러나 이것은 나에게도 효과가 없습니다. 오래된 1.x 버전을 사용하는 WordPress를 사용하고 있었고 3.4.1로 교체했지만 여전히 문제가 발생했습니다. 지난 1 시간 동안 매우 유사한 게시물이 있으므로 다소 새로운 내용과 관련이 있다고 생각합니다 ( stackoverflow.com/questions/61177140/… 참조 )
matgargano

프로젝트 node_modules에서 Jquery 패키지를 찾아 삭제 한 후 다음 명령을 사용하여 다시 설치하십시오. npm install jquery@~4.3.1
Sylvernus Akubo

나는 두 가지 버전의 jQuery를 가져 왔으며 위의 내용을 무시하고 모두 좋다!
matgargano

이 답변을 여러 번 올릴 수 있기를 바랍니다
curiousMinded

14

이것은 jQuery 3.5.0.많은 플러그인에 영향을 미치는 주요 변경 사항입니다. 일시적으로 이전 버전으로 되 돌리면 jQuery (like 3.4.1)문제가 해결되었습니다.

또는

프로젝트에서 Jquery 패키지를 찾아 node_modules삭제 하고이 명령을 사용하여 다시 설치하십시오.

npm install jquery@~3.4.1

출처 : jQuery Issue # 4665


3

로 jQuery를 제거한 yarn remove jquery다음 yarn add jquery@3.4.1다운 그레이드하도록 설치 했습니다.

문제는 yarn.lock 파일에서 3.5.0이 여전히 발견되어 오류가 계속 발생한다는 것입니다.

"dependencies"섹션 외부에서 package.json을 추가해야했습니다 .

"resolutions": { "jquery": "3.4.1" },

마침내 오류가 사라졌습니다.


3

이미 jquery 3.41을 사용했지만 프로젝트 파일을 다른 프로젝트로 옮긴 후에 문제가 발생하여 jquery 3.41을 사용하는 경우 여전히,

1) npm jquery를 제거

2) npm install jquery@~3.4.1

이 명령은 내 문제를 해결했습니다.


2

열고 package.json교체

"jquery": "^3.4.1",

"jquery": "3.4.1"

출처


1
package.json 파일에서 최상위 옵션을 사용했지만 여전히 오류가 발생했습니다. 캐럿없이 옵션으로 변경하고 자산을 다시 컴파일하면 문제가 해결되었습니다. 감사합니다!
Oranges

1
@ Oranges13 누군가를 도울 수 있다는 것을 알게되어 기쁩니다! 평화!
xameeramir

0

node_modules폴더 에서 Jquery 패키지를 제거하십시오 .

그런 다음이 명령을 사용하여 다시 설치하십시오.

npm install jquery@3.5.0
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.