ไม่สามารถแปลงวัตถุเป็นข้อผิดพลาดค่าดั้งเดิมในแอปพลิเคชันตอบโต้ได้หรือ


27

ฉันกำลังพัฒนาแอปพลิเคชั่นเริ่มระบบสปริงอย่างง่าย แต่เนื่องจากปัญหา GitHub ฉันสร้างไฟล์สตาร์ทแอปพลิเคชันใหม่โดยใช้ IntelliJ และติดตั้งโมดูลโหนดโดยใช้ข้อมูลการพึ่งพาไฟล์ของแอพพลิเคชั่นแพคเกจก่อนหน้า

ถ้าฉันใช้แถบการนำทางที่ยุบ (แถบแฮมเบอร์เกอร์ -> navbars ตอบสนองซึ่งยุบในมุมมองอุปกรณ์เคลื่อนที่) และคลิกปุ่มแฮมเบอร์เกอร์เพื่อดูลิงก์ nav มันทำให้ฉันมีข้อผิดพลาดด้านล่าง แต่ทุกสิ่งเหล่านั้นเป็นไปด้วยดีในแอปพลิเคชันก่อนหน้า

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

ฉันมีปัญหาเดียวกันในโครงการ 6 รางที่ฉันกำลังพัฒนา ฉันใช้ bootstrap 4.4.1 และมีปัญหาเดียวกันกับแถบการนำทางที่ยุบตัวของฉัน: navbar ยุบลง แต่ปุ่มแฮมเบอร์เกอร์ที่ปรากฏเมื่อยุบตัวไม่สามารถคลิกได้

การแก้ปัญหา: ปรับลด jquery จาก 3.5.0 เป็น 3.4.1 ฉันไม่ได้ดูเหตุผลที่แท้จริงของข้อผิดพลาดในตอนนี้

หากต้องการเพิ่มรายละเอียดเพิ่มเติมรุ่น jquery ควรได้รับการอัปเดตเป็นแบบpackage.jsonอ้างอิงและอย่าลืมเรียกใช้yarn install --check-filesหลังจากคุณทำเช่นนี้เพื่อให้การเปลี่ยนแปลงมีผล


ขณะนี้ฉันกำลังใช้ jquery 3.4.1
Hasindu Dahanayake

FWIW สิ่งนี้ไม่ได้ผลสำหรับฉันเช่นกัน ฉันใช้ WordPress ซึ่งใช้เวอร์ชั่นเก่า 1.x ฉันเปลี่ยนเป็น 3.4.1 และยังเห็นปัญหาอยู่ ฉันคิดว่ามีความเกี่ยวข้องกับสิ่งที่ค่อนข้างใหม่เนื่องจากมีการโพสต์ที่คล้ายกันมากในชั่วโมงที่ผ่านมา (ดูstackoverflow.com/questions/61177140/… )
matgargano

ค้นหาแพคเกจ Jquery ของคุณในโครงการ node_modules ลบและติดตั้งใหม่โดยใช้คำสั่งนี้ติดตั้ง jpmgj@qu4n.1 npm
Sylvernus Akubo

ฉันดึง jQuery ไปแล้ว 2 เวอร์ชั่นละเว้นทั้งหมดที่กล่าวมาดีมาก!
matgargano

ฉันหวังว่าฉันจะสามารถตอบคำถามนี้ได้หลายครั้ง
อยากรู้อยากเห็น

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เพื่อปรับลดรุ่น

ปัญหาคือยังพบ 3.5.0 ในไฟล์ yarn.lock ดังนั้นข้อผิดพลาดยังคงเกิดขึ้น

ฉันต้องเพิ่มใน package.json นอก"dependencies"ส่วน:

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

ในที่สุดข้อผิดพลาดก็หายไป


3

ฉันใช้ jquery 3.41 แล้วแต่ฉันมีปัญหาหลังจากย้ายไฟล์โครงการไปยังโครงการอื่นดังนั้นในกรณีของการใช้ jquery 3.41 ยังคงลองดูโดยใช้คำสั่งของ

1) npm ลบ jquery

2) npm ติดตั้ง jquery@~3.4.1

คำสั่งเหล่านี้แก้ปัญหาของฉันได้


2

เปิดpackage.jsonและแทนที่

"jquery": "^3.4.1",

กับ

"jquery": "3.4.1"

แหล่ง


1
ฉันมีตัวเลือกอันดับต้น ๆ ในไฟล์ package.json และยังมีข้อผิดพลาดอยู่ การเปลี่ยนเป็นตัวเลือกโดยไม่มีคาเร็ทและการคอมไพล์สินทรัพย์ใหม่แก้ไขให้ฉัน ขอบคุณ!
ส้ม 13

1
@ Oranges13 มันทำให้ฉันมีความสุขมากที่รู้ว่าฉันสามารถช่วยใครบางคน! สันติภาพ!
xameeramir

0

ลบแพคเกจ Jquery จากnode_modulesโฟลเดอร์

จากนั้นติดตั้งใหม่โดยใช้คำสั่งนี้

npm install jquery@3.5.0
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.