Javascript 渲染vue属性

我想在我的组件中呈现一个属性

我在模板中有：

在剧本中：

...
mounted(){
        this.components.push({, 
          component: "input", 
          prop: {type:"checkbox", v-text:"My CheckBox"}
        })

它使用任何组件或属性工作。但问题是当我试图渲染v-text时。我想这是因为-

---

如何成功呈现v文本？

首先，不带引号的属性名称只能包含字母数字、

\uu

和

$

。因此，要包含

-

，您需要引用它：

{“v-text”：“我的复选框”}

双引号或单引号有效，由您选择

如果没有引号，我甚至不希望代码解析/传输，因此我希望会有一条明确的错误消息

下一个问题是不能将

v-bind

用于

v-text

。它们是两个独立的指令，因此您在这里实际执行的是：

v-bind:v-text="'My Checkbox'"

这将被解释为没有特殊意义的DOM属性。如果检查DOM，您将看到

v-text

属性，如果将其解释为指令，则该属性将不存在

相反，您需要在数据中单独输入：

this.components.push（{，
组件：“输入”，
属性：{type:“checkbox”}，
文本：“我的复选框”
})

然后在模板中：

或：

{{c.text}}

所有这些都说明，

input

元素无论如何都不能包含任何内容，因此在这种情况下尝试使用

v-text

将毫无意义。

我认为“v-”起始名称是保留的，您可能必须将v-text更改为text，然后在组件内部处理它

mounted（）{
this.components.push（{，
组件：“输入”，
属性：{键入：“复选框”，文本：“我的复选框”}
})