关于vue.js:vue组件略佳操作

button组件

亮点:prop接管参数

<template> <button :class="'i-button-size' + size" :disabled="disabled"></button> </template><script> // 判断参数是否是其中之⼀ function oneOf (value, validList) {for (let i = 0; i < validList.length; i++) { if (value === validList[i]) { return true; } }return false; }export default { props: { size: { validator (value) { return oneOf(value, ['small', 'large', 'default']); },default: 'default' },disabled: { type: Boolean, default: false } } } </script>

使⽤组件：

<i-button size="large"></i-button> <i-button disabled></i-button>