tabBar.ts 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. // component/tabBar/tabBar.ts
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. */
  6. properties: {
  7. //接收的json,用来显示tab
  8. tabItemJson: {
  9. type: Array,
  10. value: []
  11. },
  12. //默认点击第几个(默认第一个)
  13. initTabIndex: {
  14. type: Number,
  15. value: 0
  16. },
  17. canChangeIndex: {
  18. type: Boolean,
  19. value: true
  20. }
  21. },
  22. /**
  23. * 组件的初始数据
  24. */
  25. data: {
  26. currentTab: 0,
  27. },
  28. lifetimes: {
  29. attached: function () {
  30. // 在组件实例被从页面节点树添加时执行
  31. this.initTab(this.properties.initTabIndex)
  32. },
  33. detached: function () {
  34. // 在组件实例被从页面节点树移除时执行
  35. },
  36. },
  37. /**
  38. * 组件的方法列表
  39. */
  40. methods: {
  41. //选择某一项并且给上层id
  42. bindTabItem: function (event: any) {
  43. if(this.properties.canChangeIndex){
  44. this.initTab(Number(event.target.id))
  45. }
  46. },
  47. initTab: function (index: any) {
  48. this.setData({
  49. currentTab: index
  50. })
  51. this.triggerEvent('selectItemIndex', { selectIndex: index });
  52. }
  53. }
  54. })