How to configure popper-opts

[pavlito]

Documentation for dropdown is examples of how to use popper-opts

[ahsatha]

Wondering the same, popper docs are very good but couldn't find a way to do pass popper-opts to a dropdown ):

[Szymon-dziewonski]

@ahsatha I was able to track down what format it has, and what is working looks like

:popper-opts="{
    modifiers: {
      preventOverflow: {
        padding: 0
      }
    }
  }"

Everything is happening here https://github.com/bootstrap-vue/bootstrap-vue/blob/dev/src/mixins/dropdown.js#L266 , they look for you object and merge it here https://github.com/bootstrap-vue/bootstrap-vue/blob/dev/src/mixins/dropdown.js#L277
At the end format is different. Initially I tried to pass

{modifiers: [{
    name: 'preventOverflow',
    options: {
      tether: false, // true by default
    },
  }]}

But it doesnt work because as you can see they pass simple objects without name etc

{
   modifiers: {
      offset: {
          offset: 20
        },
   }
}

Hope this will help you guys ! :)

[igorburenko]

this works for me
b-dropdown( :popper-opts={ placement: 'top', modifiers: { offset: { offset: '0,40px' } } } class="your-class")
You can modify for your taste )