Não é possível converter o objeto em erro de valor primitivo no aplicativo de reação?

Estou desenvolvendo um aplicativo de inicialização simples, mas por causa de um problema no GitHub, recrio meus arquivos iniciais do aplicativo usando o IntelliJ e instalei os módulos de nó usando os dados de dependência do arquivo package.json do aplicativo anterior.

Se eu usar uma barra de navegação em colapso (barra de hambúrguer -> barras de navegação responsivas que colapsam na visualização móvel) e clique no botão hambúrguer para ver os links de navegação, isso indica o erro abaixo. Mas todas essas coisas foram bem na aplicação anterior.

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.```

Primeiro, remova o jQuery:

npm remove jquery

e reinstale-o:

npm install jquery@~3.4.1

Eu tive o mesmo problema em um projeto rails 6 que estava desenvolvendo. Estou usando o bootstrap 4.4.1 e tive exatamente o mesmo problema com a minha barra de navegação em colapso: a barra de navegação é fechada, mas o botão de hambúrguer que aparece no recolhimento não era clicável.

A solução: faça o downgrade do jquery de 3.5.0 para 3.4.1. Por enquanto, não analisei o motivo real do erro.

Para adicionar mais detalhes, a versão do jquery deve ser atualizada em package.jsondependências e não se esqueça de executar yarn install --check-filesdepois que você fizer isso para que a alteração seja aplicada.

Isso está relacionado a jQuery 3.5.0.É uma mudança de quebra que afeta muitos plugins. A reversão temporária para uma versão anterior jQuery (like 3.4.1)do problema corrigido para mim.

ou

Localize o seu pacote Jquery no projeto node_modules, exclua-o e reinstale-o usando este comando

npm install jquery@~3.4.1

Fonte: Edição jQuery # 4665

Eu removi o jQuery e yarn remove jquery, em seguida, instalei o yarn add jquery@3.4.1downgrade.

O problema era que o 3.5.0 ainda foi encontrado no arquivo yarn.lock, portanto, o erro ainda estava ocorrendo.

Eu tive que adicionar no package.json, fora da "dependencies"seção:

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

Finalmente, o erro se foi.

Eu já usei o jquery 3.41, mas obtive o problema depois de mover meus arquivos de projeto para outro projeto, portanto, no caso de usar o jquery 3.41, ainda tente e veja executando os comandos de,

1) npm remove jquery

2) npm install jquery@~3.4.1

Esses comandos resolveram meu problema.

Abra package.jsone substitua

"jquery": "^3.4.1",

com

"jquery": "3.4.1"

Fonte

Remova o pacote Jquery da node_modulespasta.

Em seguida, reinstale-o usando este comando.

npm install jquery@3.5.0