将组件附加到多个键

Question

我有一个组件有两个属性需要它 repainted/rebuild，因为该组件不是反应性的（它是一个包装的 jQuery 组件）。

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

我发现 :key 是正确的用法 (How can I reload a vue component?, https://michaelnthiessen.com/force-re-render/)。

但是因为我有两处房产要看，所以我不知道该怎么做。

两个键导致错误duplicate attribute: :key

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

将它们放在数组中会导致警告 Avoid using non-primitive value as key, use string/number value instead.

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

如果任一模型发生变化，correct/best 重新绘制组件的方法是什么？

Answer 1

您可以使用一种方法 returns 一些基于 data 和 selected_form 的字符串 ..

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

在你的方法中..

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

Answer 2

对于两个键，我们可以使用：

<component :key="data && selected_form"></component>

Attach component to multiple keys