The main package is located in app/javascript/packs/admin_application.js, here you will declare the components you want to include in your ActiveAdmin views as you would in a normal Vue App.
Additionally, to be able to use Vue components as Arbre Nodes the component names are also declared in config/initializers/active_admin.rb
The generator includes an example component called admin_component, you can use this component inside any ActiveAdmin view by just writing admin_component as you would with any html tag.
For example:
admin_component(class:"myCustomClass",id:"myCustomId") do
admin_component(id:"otherCustomId")
end
(Keep in mind that the example works with ruby blocks because AdminComponent has a <slot> tag defined, therefore children can be added to the component)
The integration supports passing props to the components and converts them to their corresponing javascript objects.
This project supports Vue inside ActiveAdmin
app/javascript/packs/admin_application.js
, here you will declare the components you want to include in your ActiveAdmin views as you would in a normal Vue App.config/initializers/active_admin.rb
admin_component
, you can use this component inside any ActiveAdmin view by just writingadmin_component
as you would with anyhtml
tag.AdminComponent
has a<slot>
tag defined, therefore children can be added to the component)v-for
,:key
etc.