vue组件，prop声明并传递，但是console说prop丢失答案

【问题标题】：Vue component, prop is declared and passed, but console says prop is missingvue组件，prop声明并传递，但是console说prop丢失
【发布时间】：2021-08-29 20:17:32
【问题描述】：

我正在使用 vue + laravel 创建可重用的表单输入。

我有一个需要的道具，我通过它并按预期呈现，但控制台仍然记录错误：

“Vue 警告]：缺少必需的道具：“inputId”。

检查 vue 元素会显示定义的 prop。为什么在传递数据时会产生错误？

文本输入组件

<template>
    <input type="text" :name="inputId" :id="cssid" :placeholder="placeholder" :value="value">
</template>

<script>
    export default {
        props: {
          inputId: {
            type: String,
            required: true,
          },
          isRequired: {
            type: Boolean,
            default: false,
          },
          placeholder: {
            type: String,
          },
          value: {
            type: String,
            default: '',
          },
        },

        mounted() {
            console.log('text mounted.')
        },

        computed: {
          cssid() {
            return this.inputId + '_selection';
          },
        },
    }
</script>

刀片视图片段，其中组件被调用（我试过用引号而不是引号，没有区别）

<text-input
  input-id="title"
></text-input>

Resultant html结果是正确的，但是为什么会出错？

<input type="text" name="title" id="title_selection">

【问题讨论】：

这能回答你的问题吗？ :) Missing required prop

标签： laravel vue.js vue-component

【解决方案1】：

在这种情况下，我有两个组件实例，但我没有意识到旧的实例在那里。较旧的没有声明道具并给出错误，但在控制台中我已经加载了两次并不明显。删除组件的旧实例修复了错误。

【讨论】：