反应式默认道具值

Posted 2023-02-16

【中文标题】反应式默认道具值

【英文标题】：Reactive default prop value

【发布时间】：2022-01-13 06:59:47

【问题描述】：

在下面：

  props: 
    id: 
      type: String,
      default() 
        return this.$route.params.id;
      ,
    ,
  ,

然后，假设父组件不提供值，我希望 id 道具的值在路由更改为新 id 时更改。然而，情况似乎并非如此。我的理解正确吗？有没有办法在这里实现反应？否则我正在考虑设置 required: false ，然后我必须有一些 computedId 计算字段，但我宁愿直接在 props 部分进行

【参考方案1】：

直接在 props 中基于变量提供默认值并不是一个好主意，props 中的 default 被认为是提供静态值而不是反应值

---

在模板中使用计算值而不是道具可能是更好的做法

<div> computedId </div>


  props: 
    id: 
      type: String,
    ,
  ,
  computed: 
     computedId() 
        return this.value || this.$route.params.id
     
  

【参考方案2】：

只使用计算不是更好吗？或者使用watch监听id并执行强制刷新功能，但是我真的不知道怎么直接在props中设置action