Vuetify，工具提示：什么是“on”和“attrs”？

Question

我在 Vuetify 文档中寻找“工具提示”，我找到了这个例子：

<v-tooltip left>
  <template v-slot:activator="{ on, attrs }">
    <v-btn
      color="primary"
      dark
      v-bind="attrs"
      v-on="on"
    >Left</v-btn>
  </template>
  <span>Left tooltip</span>
</v-tooltip>

是什么on和attrs为了什么？为什么它们是强制性的？

另外，这是侦听click事件的正确方法吗？

<v-tooltip bottom>
  <template v-slot:activator="{ on }">
    <v-btn v-on="{...on, click: onToggle }" icon>
      <v-icon>mdi-eye</v-icon>
    </v-btn>
  </template>
  Show password
</v-tooltip>

Answer 1

我可以解释一下这意味着什么，但我认为这个视频更好地解释了它我让你有时间解释 v-on 和 attrs

只需查看透明包装器部分

https://youtu.be/7lpemgMhi0k?t=1314

概括

v-on : 绑定一系列监听函数

更多信息：https : //vuejs.org/v2/api/#v-on

$attrs：存储父组件中设置的属性，可以在内部组件中复用

更多信息：https : //vuejs.org/v2/api/#inheritAttrs

除了视频中显示的内容之外，您还可以找到其他用法，但这transparent wrappers是一个常见的用例。