vue|vue 动态 Prop vue|es6

Vue.component('my-component', { props: { // 基础的类型检查 (`null` 和 `undefined` 会通过任何类型验证) 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 ['success', 'warning', 'danger'].indexOf(value) !== -1 } } } })

动态 Prop
prop 是单向绑定的：当父组件的属性变化时，将传导给子组件，但是不会反过来。（vue 2.0以后的属性），
当 prop 验证失败的时候，(开发环境构建版本的) Vue 将会产生一个控制台的警告。
type 可以是下面原生构造器：
String
Number
Boolean
Array
Object
Date
Function
Symbol
一共8种类型
Symbol 本质上是一种唯一标识符，可用作对象的唯一属性名，这样其他人就不会改写或覆盖你设置的属性值。
声明方法：

let id = Symbol("id“);

Symbol 数据类型的特点是唯一性，即使是用同一个变量生成的值也不相等。
let id1 = Symbol(‘id’);
let id2 = Symbol(‘id’);
console.log(id1 == id2); //false
有点像[] (嗯你可以试试 [][][]===[])
ymbol 数据类型的另一特点是隐藏性，for···in，object.keys() 不能访问

let id = Symbol("id"); let obj = { [id]:'symbol' }; for(let option in obj){ console.log(obj[option]); //空 }

但是也有能够访问的方法：Object.getOwnPropertySymbols
Object.getOwnPropertySymbols 方法会返回一个数组，成员是当前对象的所有用作属性名的 Symbol 值。

let id = Symbol("id"); let obj = { [id]:'symbol' }; let array = Object.getOwnPropertySymbols(obj); console.log(array); //[Symbol(id)] console.log(obj[array[0]]); //'symbol' ————————————————

【vue|vue 动态 Prop】原文链接
嗯 Symbols 这个属性是ES6 新引入的
（ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因）
嗯这个大概就是原因了

let mySymbol = Symbol(); // 第一种写法 let a = {}; a[mySymbol] = 'Hello!'; // 第二种写法 let a = { [mySymbol]: 'Hello!' }; // 第三种写法 let a = {}; Object.defineProperty(a, mySymbol, { value: 'Hello!' }); // 以上写法都得到同样结果 a[mySymbol] // "Hello!"

上面代码通过方括号结构和Object.defineProperty，将对象的属性名指定为一个 Symbol 值。
注意，Symbol 值作为对象属性名时，不能用点运算符。
参考ES6 官网
我是菜鸟。。我在飞。。。