Vue $ refs和烤肉串案

Question

在第1节中,可以这样做:

<app v-ref:test-app></app>

然后像这样引用它:

vm.$refs.testApp;

但是在vue 2中,ref的语法已更改为:

<app ref="test-app"></app>

但这不再可以被引用

vm.$refs.testApp

相反,它只适用于:

<app ref="testApp"></app> 

在标准DOM中不允许使用哪些内容.这是一个错误吗？可以不再使用烤肉串吗？

Answer 1

由于语法已从命名空间元素属性(即v-ref:foo-bar)更改为普通键值对属性(即ref="fooBar"),因此隐式kebab-case-to-camel-case转换不再适用,因为引用name是一个纯字符串,不受必须符合必需的小写kebab-case HTML语法的限制.

换句话说,您可以使用任何字符串标识ref,因此Vue操纵它是没有意义的.看一下这个CodePen,看看我的意思.

但是,基本上,一个普通的字符串ref值意味着你可以像这样定义一个引用:

<div id="app" ref="test ** app!"></div>

并从Vue引用它,如下所示:

this.$refs['test ** app!']

简而言之,不,这不是一个错误,但不是,自动烤肉串转换不再发生.