.vue中的默认值设置
时间: 2024-04-28 19:03:37 浏览: 55
vue-default-value-Vue.js 2.x指令为可编辑元素设置默认值,而不会影响模型状态-Vue.js开发
在 Vue 的组件中,可以使用 `props` 属性来声明组件的属性,并且可以设置默认值。
例如,在组件中声明一个 `message` 属性,并设置默认值为 `"Hello, World!"`:
```
<template>
<div>{{ message }}</div>
</template>
<script>
export default {
props: {
message: {
type: String,
default: "Hello, World!"
}
}
}
</script>
```
在上面的代码中,`props` 对象中的 `message` 属性设置了两个选项:类型为 `String`,默认值为 `"Hello, World!"`。这意味着如果组件的使用者没有传递 `message` 属性,那么默认值将会被使用。
注意,如果一个属性的默认值是一个对象或数组,需要用一个函数返回该对象或数组,否则会导致该默认值在不同组件实例之间共享。例如:
```
props: {
options: {
type: Array,
default: () => []
}
}
```
这样,每个组件实例都会有自己的 `options` 数组。
阅读全文