Question

例如，当您创建组件时，我们将其命名为 test-component 。我们可以对其应用id和/或class来识别它吗？我们还可以使用name属性，以便将此自定义组件用作表单输入（因为它可以在其中包含输入）吗？

<test-component class="test-class" name="test-input" />

如果没有，还有什么选择？

Answer 1

如果将任何属性添加到组件，则它们将被添加到组件的第一个元素中（除非它们被注册为道具）。

因此，如果您不希望name属性出现在组件的第一个元素上，则需要使用Props。这是一个示例：

<template>
  <div>
    <input type="text" :name="name">
  </div>
</template>

<script>
export default {
  name: "TestComponent",
  props: ['name']
};
</script>

现在，您可以按照说明使用组件。结果将是：

<div class="test-class">
    <input type="text" name="maycustomname">
</div>

在官方文档中了解有关道具的更多信息：https://vuejs.org/v2/guide/components-props.html

可以将“ name”属性用于自定义VueJS组件

1 个答案: