Vue.js如何给多页面复用的组件传Id 无需每个页面都声明对应Props

方案1：使用带默认值的可选Prop（最推荐） #

Vue的Prop本身支持非必填配置，你只需要在公共组件的Prop定义中给新增的id参数设置required: false和默认值即可，现有未传id的调用代码完全不需要修改，符合你的需求。

代码示例 #

公共组件的Props配置：

Vue2 写法

export default {
  props: {
    id: {
      type: [String, Number], // 支持字符串/数字类型的id
      required: false, // 标记为非必填
      default: null // 未传值时的默认值
    }
  }
}

Vue3