【问题标题】:What is the purpose of the default value in props in vue if vue still throws an error?如果vue仍然抛出错误,那么vue中props中的默认值的目的是什么?
【发布时间】:2020-11-26 07:03:31
【问题描述】:

我正在尝试了解道具验证是针对开发人员还是针对用户的。我故意将一个组件留空

我没有传递一个值(顺便问一下,这个传递的值叫什么?):<card />
正确方法:<card :name="name" />

props:{
    name: { default: "John Doe" }

但是,当我将组件留空,不传递值时,Vue 使用默认值填充模板部分中的值,同时在控制台中留下错误: Property or method "name" is not defined on the instance but referenced during render.

如果我想要一个默认值怎么办?我将继续收到该错误。

【问题讨论】:

  • 请分享您将名称传递给它的父代码

标签: javascript vue.js default vue-props


【解决方案1】:

道具验证对开发人员和用户都很有用,但可选。

我认为问题在于这一行(我将输入重构为“myName”来解释): <card :name="myName" />

出现错误是因为myName 在传递给组件之前没有正确定义。

这些将用作静态示例:

  • <card name="Jesse" /> 因为名称未与 :v-bind: 绑定
  • <card :name="'Jesse'" /> 因为 name 在这里绑定,但是绑定到一个文字字符串 'Jesse'

<card :name="myName" /> 可以工作,你只需要断言 myName 不是未定义的。

myName 本身也可以是父组件中的道具,如果您愿意,例如: props: { myName: { default: "Jesse"} }

【讨论】:

    猜你喜欢
    • 2019-03-18
    • 2016-06-07
    • 2020-02-19
    • 2022-10-19
    • 2017-09-21
    • 1970-01-01
    • 2020-04-12
    • 2019-12-28
    • 1970-01-01
    相关资源
    最近更新 更多