index.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. // cpn/search-bar/index.js
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. */
  6. externalClasses: [
  7. 'l-class',
  8. 'l-input-container',
  9. 'l-placeholder-class',
  10. 'l-input-class',
  11. 'l-cancel-class'
  12. ],
  13. properties: {
  14. confirmType: {
  15. type: String,
  16. value: 'search'
  17. },
  18. placeholder: String,
  19. confirmType: {
  20. type: String,
  21. value: 'search'
  22. },
  23. cancelText: {
  24. type: String,
  25. value: '取消'
  26. },
  27. address:String,
  28. iconColor: {
  29. type: String,
  30. value: '#333'
  31. },
  32. iconSize: {
  33. type: String,
  34. value: '28'
  35. },
  36. bgColor:{
  37. type:String,
  38. value:'#f3f3f3'
  39. },
  40. showCancel: {
  41. type: Boolean,
  42. value: true
  43. },
  44. shape:{
  45. type:String,
  46. value:'primary'
  47. },
  48. TextAlign:{
  49. type:String,
  50. value:'left'
  51. },
  52. adress:String,
  53. // 获取焦点
  54. focus: {
  55. type: Boolean,
  56. value: false
  57. },
  58. // 是否显示清除按钮
  59. clear: {
  60. type: Boolean,
  61. value: true
  62. },
  63. // 最大输入长度
  64. maxlength: {
  65. type: Number,
  66. value: 140
  67. },
  68. // 是否禁用
  69. disabled: {
  70. type: Boolean,
  71. value: false
  72. },
  73. // 占位文字的样式
  74. placeholderStyle: {
  75. type: String,
  76. value: ''
  77. }
  78. },
  79. /**
  80. * 组件的初始数据
  81. */
  82. data: {
  83. },
  84. /**
  85. * 组件的方法列表
  86. */
  87. methods: {
  88. onCancel(){
  89. this.triggerEvent('onCancel')
  90. },
  91. // input属性列表
  92. handleInputChange(event) {
  93. const {
  94. detail = {}
  95. } = event;
  96. const {
  97. value = ''
  98. } = detail;
  99. this.setData({
  100. value
  101. });
  102. this.triggerEvent('linchange', event);
  103. },
  104. handleInputFocus(event) {
  105. this.triggerEvent('linfocus', event);
  106. },
  107. handleInputBlur(event) {
  108. this.triggerEvent('linblur', event);
  109. },
  110. handleInputConfirm(event) {
  111. const {
  112. detail = {}
  113. } = event;
  114. const {
  115. value = ''
  116. } = detail;
  117. this.setData({
  118. value
  119. });
  120. this.triggerEvent('linconfirm', event);
  121. },
  122. onClearTap(event) {
  123. this.setData({
  124. value: ''
  125. });
  126. this.triggerEvent('linclear', event);
  127. }
  128. }
  129. });