Vue props默认值类型有哪些

目录

字符串类型

数字类型

布尔类型

对象类型

数组类型

函数类型

---

在Vue中，props的默认值类型可以是字符串、数字、布尔、对象、数组或函数。以下是每个类型的示例：

字符串类型

props: {
  title: {
    type: String,
    default: 'Hello'
  }
}

数字类型

props: {
  count: {
    type: Number,
    default: 0
  }
}

布尔类型

props: {
  isActive: {
    type: Boolean,
    default: false
  }
}

对象类型

props: {
  user: {
    type: Object,
    default: function() {
      return { name: 'John', age: 20 }
    }
  }
}

//简写

props: {
  user: {
    type: Object,
    default: () =>  { name: 'John', age: 20 },
  }
}

数组类型

props: {
  colors: {
    type: Array,
    default: function() {
      return ['red', 'blue', 'yellow']
    }
  }
}

//简写 

props: {
  colors: {
    type: Array,
    default:  () => ['red', 'blue', 'yellow'],
  }
}

//默认值值不要直接加[],  记得前面加上  () => 

函数类型

props: {
  fetchData: {
    type: Function,
    default: function() {
      return axios.get('/api/data')
    }
  }
}

请注意，上述示例中的default属性定义了props的默认值。

有用请点赞，养成良好习惯！

鼓励、交流、疑问请留言！