vue 中何时使用 prop 修饰符？

Question

vue 中何时使用 prop 修饰符？

在vue文档中，我在这里找到v-bind中的prop修饰符： https: //v2.vuejs.org/v2/api/#v-bind

我的问题是这样的：

Answer 1

https://v2.vuejs.org/v2/api/#v-bind

\n

来自文档：

\n

\n

修饰符：
\n.prop - 绑定为 DOM 属性而不是属性（有什么区别？\xe2\x80\x99s？）。如果标签是组件，则 .prop 将在组件\xe2\x80\x99s $el 上设置属性。

\n

\n

这很有用，因为某些 HTML 输入无法接收值作为属性，但需要传递 ref 本身。

\n

例如，查看indeterminate复选框的状态。通常你需要做

\n

<template>\n<!-- this doesn\'t work, because there\'s no indeterminate prop on the checkbox, it only exists on the DOM element -->\n  <input type="checkbox" :indeterminate="indeterminateProp" /> \n</template>\n\n<script>\nbeforeUpdate() {\n  //set indeterminate directly on the dom element object\n  // this is what you\'d always have to do if v-bind.prop didn\'t exist\n  this.$refs.myCheckbox.indeterminate = this.indeterminateProp;\n}\n</script>\n

\n

并在 vue 的反应系统之外手动跟踪它。

\n

但多亏了 .prop，你可以这样做

\n

<input type="checkbox" :indeterminate.prop="indeterminateProp"/>\n

\n

无需使用生命周期挂钩。

\n

因此 .prop 基本上告诉 vue“将此值应用于 DOM 节点本身（通常从 $refs 获取的值），而不是尝试将其作为属性或属性应用”

\n