[Vue.js]学习笔记-Vue.js组件-Prop验证

范范

[Vue.js]学习笔记-Vue.js组件-Prop验证

导读部分

---

讨论区：http://www.sufeinet.com/forum-58-1.html

教程目录：http://www.sufeinet.com/thread-24026-1-1.html

教程部分

---

Vue.js 使用了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。

另： Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。

组件可以为 props 指定验证要求。

prop 是一个对象而不是字符串数组时，它包含验证要求：

---

[HTML] 纯文本查看 复制代码

Vue.component('example', {
  props: {
    // 基础类型检测 （`null` 意思是任何类型都可以）
    propA: Number,
    // 多种类型
    propB: [String, Number],
    // 必传且是字符串
    propC: {
      type: String,
      required: true
    },
    // 数字，有默认值
    propD: {
      type: Number,
      default: 100
    },
    // 数组／对象的默认值应当由一个工厂函数返回
    propE: {
      type: Object,
      default: function () {
        return { message: 'hello' }
      }
    },
    // 自定义验证函数
    propF: {
      validator: function (value) {
        return value > 10
      }
    }
  }
})

type 可以是下面原生构造器：

---

[C#] 纯文本查看 复制代码

String[/size][/font][/color][/align][/font]Number
Boolean
Function
Object
Array

type 也可以是一个自定义构造器，使用 instanceof 检测。

Amy

看到这帖子真是高兴！

竹林风

我只是路过打酱油的。