Attach component to multiple keys

I have a component that has two attributes that need it to be repainted/rebuild, as the component is not reactive (it is a wrapped jQuery component).

<component :template="template" :submit="submit" :data="data"></component>

As I found out the :key is the right thing to use (How can I reload a vue component?, https://michaelnthiessen.com/force-re-render/).

But since I have two properties to watch I don't know how to do that.

Two keys result in the error duplicate attribute: :key

<component :key="data" :key="selected_form" :template="template" :submit="submit" :data="data"></component>

And putting them in an array results in the warning Avoid using non-primitive value as key, use string/number value instead.

<component :key="[data, selected_form]" :template="template" :submit="submit" :data="data"></component>

What is the correct/best way of repainting a component if either of the models changes?

You could use a method that returns some string based on data and selected_form ..

<component :key="getKey(data, selected_form)" :template="template" :submit="submit" :data="data"></component>

And in your methods ..

methods: {
  getKey(data, selected_form) {
    // return some string based on data and selected_form
  }
}