myinfo2.vue 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <template>
  2. <view class="jiben">
  3. <view class="schoolicon">
  4. <image src="../../static/北大@2x.png" mode=""></image>
  5. </view>
  6. <view class="icontext">
  7. 系统预测该校录取概率为:{{}}
  8. </view>
  9. <view class="jieshao">
  10. <!-- <sun-tab :value.sync="index" :tabList="tabList"></sun-tab> -->
  11. <sun-tab :value.sync="index" @change="objectChange" :tabList="tabObjectList" rangeKey="name"></sun-tab>
  12. </view>
  13. </view>
  14. </template>
  15. <script>
  16. import sunTab from '@/components/sun-tab/sun-tab.vue';
  17. export default {
  18. components: {
  19. sunTab
  20. },
  21. data() {
  22. return {
  23. index: 0,
  24. tabList: ['学院介绍','开设专业','录取招生'], //普通数据赋值
  25. tabObjectList: [ //对象数组赋值
  26. {
  27. name: '学院介绍',
  28. value: 1
  29. },
  30. {
  31. name: '开设专业',
  32. value: 2
  33. },
  34. {
  35. name: '录取招生',
  36. value: 3
  37. }
  38. ],
  39. }
  40. },
  41. methods: {
  42. arrayChange(e){
  43. console.log('数组数据返回格式');
  44. console.log(e);
  45. },
  46. objectChange(e){
  47. console.log('对象数据返回格式');
  48. console.log(e);
  49. }
  50. }
  51. }
  52. </script>
  53. <style>
  54. .jiben{
  55. padding-top: 60upx;
  56. width:750upx;
  57. height:1002upx;
  58. background:rgba(255,255,255,1);
  59. }
  60. .schoolicon{
  61. margin: 0 auto;
  62. width: 180upx;
  63. height: 180upx;
  64. }
  65. .schoolicon image{
  66. display: inline;
  67. }
  68. .icontext{
  69. margin-top: 24upx;
  70. text-align: center;
  71. font-size:28upx;
  72. font-family:PingFangSC;
  73. font-weight:400;
  74. color:rgba(117,119,128,1);
  75. line-height:40upx;
  76. }
  77. </style>