easyUI/component/button/icon_button/icon_button.js at master · qq865738120/easyUI · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
// component/button/icon_button/icon_button.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    icon: {
      type: String,
      value: '',
      observer: function (newVal) {
        this.setData({ mSrc: newVal }); // 初始化mSrc
      }
    },
    text: {
      type: String,
      value: '',
      observer: function (newVal) {
        this.setData({ mText: newVal }); // 初始化mText
      }
    },
    iconWidth: { // 图标大小
      type: String,
      value: '50',
    },
    iconHeight: { // 图标大小
      type: String,
      value: '50',
    },
    width: { // 组件大小
      type: String,
      value: '188'
    },
    height: { // 组件大小
      type: String,
      value: '188'
    },
    spacing: { // 图标与文字间距
      type: String,
      value: '14'
    },
    fontSize: {
      type: String,
      value: '24'
    },
    fontColor: {
      type: String,
      value: '#333333'
    },
    dataCus: {
      type: String,
      value: ''
    },
    badge: {
      type: String,
      value: ''
    },
    badgeSize: {
      type: String,
      value: '18'
    },
    badgeColor: {
      type: String,
      value: '#F23030'
    },
    formType: {
      type: String,
      value: ''
    },
    openType: {
      type: String,
      value: ''
    }
  },

  externalClasses: ['cus', 'cus-icon'],

  /**
   * 组件的初始数据
   */
  data: {
    mSrc: '',
    mText: '按钮文本',
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onTap: function (e) {
      console.log('icon_button点击事件触发', e);
      this.triggerEvent('buttontap', e, { bubbles: true });
    },
    submit: function (e) {
      console.log('icon_button提交事件触发', e);
      this.triggerEvent('submit', e.detail, { bubbles: true });
    },
    reset: function (e) {
      console.log('icon_button重置事件触发', e);
      this.triggerEvent('submit', e, { bubbles: true });
    }
  }
})