login.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. <template>
  2. <div @click="tologin">登录</div>
  3. <h2> {{ store.name }}</h2>
  4. <h1 @click="changeName">修改名称</h1>
  5. <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
  6. <div @click="networkRequest()">点击发起网络请求</div>
  7. </template>
  8. <script lang="ts" setup>
  9. import { useRoute, useRouter } from 'vue-router'
  10. import { useStore } from "../store/index";
  11. import { post } from '@/utils/request'
  12. const router = useRouter()
  13. const store = useStore()
  14. function tologin() {
  15. router.push({
  16. name: 'index'
  17. })
  18. }
  19. function changeName(): void {
  20. store.name = '索索'
  21. }
  22. async function networkRequest(): Promise<void> {
  23. console.log('发起请求')
  24. const requestUrl = '/user/loginAdmin'
  25. const data = {
  26. username: '18130408100',
  27. password: '220926'
  28. }
  29. // proxy.$post(requestUrl, data)
  30. // .then((response: any) => {
  31. // console.log(response, '<=== 请求返回的数据')
  32. // })
  33. const res = await post(requestUrl, data)
  34. console.log(res, '<=== 请求返回的数据')
  35. }
  36. interface Tree {
  37. label: string
  38. children?: Tree[]
  39. }
  40. const handleNodeClick = (data: Tree) => {
  41. console.log(data)
  42. }
  43. const data: Tree[] = [
  44. {
  45. label: 'Level one 1',
  46. children: [
  47. {
  48. label: 'Level two 1-1',
  49. children: [
  50. {
  51. label: 'Level three 1-1-1',
  52. },
  53. ],
  54. },
  55. ],
  56. },
  57. {
  58. label: 'Level one 2',
  59. children: [
  60. {
  61. label: 'Level two 2-1',
  62. children: [
  63. {
  64. label: 'Level three 2-1-1',
  65. },
  66. ],
  67. },
  68. {
  69. label: 'Level two 2-2',
  70. children: [
  71. {
  72. label: 'Level three 2-2-1',
  73. },
  74. ],
  75. },
  76. ],
  77. },
  78. {
  79. label: 'Level one 3',
  80. children: [
  81. {
  82. label: 'Level two 3-1',
  83. children: [
  84. {
  85. label: 'Level three 3-1-1',
  86. },
  87. ],
  88. },
  89. {
  90. label: 'Level two 3-2',
  91. children: [
  92. {
  93. label: 'Level three 3-2-1',
  94. },
  95. ],
  96. },
  97. ],
  98. },
  99. ]
  100. const defaultProps = {
  101. children: 'children',
  102. label: 'label',
  103. }
  104. </script>