VueJS Component, can't override class

Question

i\'m trying to over-ride a certain instance of my VueJS Component, however for some reason the component is still using the default value.

The value i\'m trying to

Answer 1

Depending on how this is all put together, props in the template are sometimes required to be kebab-cased, ie

<delete-button button-class="is-info" ...

See https://vuejs.org/v2/guide/components-props.html#Prop-Casing-camelCase-vs-kebab-case

HTML attribute names are case-insensitive, so browsers will interpret any uppercase characters as lowercase. That means when you’re using in-DOM templates, camelCased prop names need to use their kebab-cased (hyphen-delimited) equivalents

FYI, single-file components do use "in-DOM templates".