·Prop 可以设置类型检查,这时需要将props更改为一个带有验证需求的对象,并指定对应类型。

    Props 类型 - 图1

    Props 类型 - 图2

    ·prop 还可以同时指定多个类型,通过数组方式保存即可

    Props 类型 - 图3

    <!DOCTYPE html> <html lang=“en”> <head> <meta charset=“UTF-8”> <meta name=“viewport” content=“width=device-width, initial-scale=1.0”> <title>Document</title> </head> <body> <div id=“app”> <my-component :par-str=“str” :par-num=“num” :par-arr=“arr” :par-obj=“obj” :par-any=“any” :par-data=“str” ></my-component> </div> <script src=“lib/vue.js”></script> <script> Vue.component(‘MyComponent’, { // 如果要设置 props 的具体规则,需要更改为对象写法 props: { parStr: String, parNum: Number, parArr: Array, parObj: Object, parAny: undefined, // null parData: [String, Boolean] }, template: `
    {{ parStr }} {{ parNum }} {{ parArr }} {{ parObj }} {{ parAny }} {{ parData }}
    ` }) new Vue({ el: ‘#app’, data: { num: 100, str: ‘abc’, arr: [1, 2, 3], obj: { content1: ‘示例内容1’, content2: ‘示例内容2’ }, any: [1, 2, 3] } }); </script> </body> </html>