ColorPicker

基于 pickr 改造的颜色选择器。

使用

  1. <m-color-picker
  2. id='picker'
  3. save="0"
  4. preview="0"
  5. button='0'
  6. clear='0'
  7. width="300px">
  8. </m-color-picker>
  9. <script>
  10. var picker = document.querySelector('#picker')
  11. picker.addEventListener('change', function(evt){
  12. console.log(evt.detail.color)
  13. })
  14. </script>

API

Props

  1. {
  2. button?: boolean;
  3. preview?: boolean;
  4. opacity?: boolean;
  5. hue?: boolean;
  6. hex?: boolean;
  7. rgba?: boolean;
  8. hsla?: boolean;
  9. hsva?: boolean;
  10. input?: boolean;
  11. clear?: boolean;
  12. save?: boolean;
  13. cmyk?: boolean;
  14. default?: string;
  15. swatches?: string[];
  16. inline?: boolean;
  17. strings?: {
  18. save: string;
  19. clear: string;
  20. };
  21. width?: string;
  22. }

defaultProps

  1. {
  2. button: true,
  3. preview: true,
  4. opacity: true,
  5. hue: true,
  6. hex: true,
  7. rgba: true,
  8. hsla: true,
  9. hsva: false,
  10. input: true,
  11. clear: true,
  12. save: true,
  13. cmyk: false,
  14. default: '#3365B7',
  15. swatches: [],
  16. inline: true,
  17. strings: {
  18. save: 'Save', // 保存按钮的文字
  19. clear: 'Clear' // 清楚按钮的文字
  20. }
  21. }