[ERROR] Error during usage bootstrap accordion item

[mpocin]

Dear @gwenaelp,
I'm having some issues during usage of the component that uses bootstrap accordion item.
here the console log:

Unknown custom element: <field-array-bootstrap-accordion-item> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

here some dependencies:
"vue": "^2.5.2",
"vue-form-generator": "^2.2.2",
"bootstrap": "^4.1.3",
"jquery": "^3.3.1",
"vfg-field-array": "0.0.0-development"

here the snippet of the code:

<template>

  <vue-form-generator :model="model"
                      :schema="schema"
                      :options="formOptions"
                      ref="form">
  </vue-form-generator>

</template>

and at the script part I just copied the code at:
(https://github.com/gwenaelp/vfg-field-array#with-bootstrap-4-container-component-object-as-array-item-validation-and-inputname)

and the main.js:

...
import VueFormGenerator from 'vue-form-generator'
import 'vue-form-generator/dist/vfg.css'
import FieldArray from 'vfg-field-array'

...
Vue.use(VueFormGenerator)
Vue.use(FieldArray)

what I'm doing wrong?

[gwenaelp]

I think you need to import this component manually. There was a discussion about it few months ago and I decided not to merge it in the core of vfg-field-array, because I don't think adding bootstrap as a dependency of this lib is a good idea. We are not all using bootstrap and it's a heavy dependancy.

If you have a look at the stories folder, you will see that there is a "bootstrap-accordion-container.vue" file. This contains the component you are trying to integrate.

What you need to do is to load yourself this component. Try to load it globally in your main.js :

import bootstrapAccordionContainerItem from 'my/folder/bootstrap-accordion-container'

Vue.component('field-array-bootstrap-accordion-item', bootstrapAccordionContainerItem);

This should be able to solve this error.

If this works, you can also try to load it locally, which is a bit cleaner. It's been a long time I haven't done it this for array items containers in this lib, but I think you might be able to load it locally.

Tell me how you're doing with this issue, i'll try to investigate a bit more if you can't solve it 😄 👍

[mpocin]

Oh, thanks a lot for the reply. I will try your approach and I'll let you know.
^^

[gwenaelp]

I just updated the npm package, if there is still a problem, just put another message on this issue :D