Key.js 892 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import { use } from '../utils';
  2. import { preventDefault } from '../utils/event';
  3. const [sfc, bem] = use('key');
  4. export default sfc({
  5. props: {
  6. type: Array,
  7. text: [String, Number]
  8. },
  9. data() {
  10. return {
  11. active: false
  12. };
  13. },
  14. computed: {
  15. className() {
  16. const types = this.type.slice(0);
  17. this.active && types.push('active');
  18. return bem(types);
  19. }
  20. },
  21. methods: {
  22. onFocus() {
  23. this.active = true;
  24. this.$emit('press', this.text);
  25. },
  26. onBlur(event) {
  27. preventDefault(event, true);
  28. this.active = false;
  29. }
  30. },
  31. render(h) {
  32. const { onBlur } = this;
  33. return (
  34. <i
  35. class={['van-hairline', this.className]}
  36. onTouchstart={this.onFocus}
  37. onTouchmove={onBlur}
  38. onTouchend={onBlur}
  39. onTouchcancel={onBlur}
  40. >
  41. {this.text}
  42. </i>
  43. );
  44. }
  45. });