我正在使用vuetifys的v-form组件来创建一个表单。在表单中,有大量的v-text-field和v-checkbox组件,它们是动态创建和分配ids的。我希望能够打印出所有的it /值(到控制台作为概念证明),但我没有看到任何关于如何做到这一点的文档。
例如:
<v-form v-model="foo" ref="bar">
<v-text-field :id="dynamicallyGenerated" class="baz"/>
<v-text-field :id="anotherDynamicallyGenerated" class="baz"/>
<v-checkbox :id="yetAnotherDynamicallyGenerated" class="baz"/>
</v-form>
...
const elements = this.$refs.bar.$el;
// And somehow I would like to get an array of all the form elements that have
// the class called "baz" then do something like this with it
someArray.forEach((entry) ==> {
console.log(entry.id, entry.value);
});
我尝试过使用this.$refs.bar.$el.querySelectorAll(".baz");
,但是它返回了大量的嵌套div(由于vuetify构建组件的方式),而且看起来很难处理。我想知道我是否应该使用querySelectorAll,或者是否有更简单的东西。
发布于 2020-12-18 21:22:50
这比我想象的要简单。我只需要做
this.$refs.bar.$el.querySelectorAll(".baz input")
https://stackoverflow.com/questions/65348294
复制相似问题