项目学习末篇+git使用感悟

从项目提出开始到现在,已经一个月多一点了,真正开始写是从上周六中午开始的,因为有模板的缘故,所以写的可能快了一点。接下来分享一下本次项目中使用或者新学习到的内容:

一、有关数据类型的易错点:

1.在js语言中,判断是否相等时一般都是使用“===”,而这个符号就代表的全等,即值和类型都相等时判断才为true。在学习过程中一般程序没有那么复杂,每个数据大家基本都记得,因此也很少会出错。但是在真正的项目中,各种变量就比较多了,当我们处于学习环境中时间长了,意识中对类型的控制就比较疏忽,所以很有可能会在这个方面出错,甚至在检查的时候还不容易检查出错误。

2.在发送请求时,要注意接口所需数据的类型与自己传过去的参数类型是否相同,不相同的话会导致后端返回数据失败。

二、本次项目中复习到的/新学到的知识点:
1.时间转时间戳

先转成Date形式,然后再转成时间戳var date = new Date('时间') 

1、var time1=new Date(data).getTime() //单位为毫秒//可以除以1000转换成秒
2、var time2 = new Date(data).valueOf() //单位为毫秒//可以除以1000转换成秒
3、var time3 = Date.parse(data); //单位为秒
2.overflow:auto;超出部分变成滚动条
3.setup写在script标签上和script标签内的区别

写在script标签上:

<script setup> </script>

写在script标签内:

<script>
export default {
  setup(){
  }
}
</script>

写在标签上的时候可以简化写法:

定义的数据就可以直接使用,不需要抛出;

引入其他组件时直接引入后就可以使用,不需要在components注册了;

更多详见:vue3中的单文件组件<script setup>和setup函数区别 详解_

4.get和post请求参数的写法

GET:注:对于GET请求运用那种写法目前没找到规律,少的话就先用第一种,多的话就第二种。

        1.可以跟在url链接之后用‘?’隔开,每个属性用&链接。比如

export function dataList(page, page_size) {
  return request({
    url: `/reservation?page=${page}&page_size=${page_size}`,
    method: "GET"
  })
}

        2。可以在请求体中使用params属性后写,用":"链接,并用大括号括住,每个属性用","隔开。例如

export function selKeywords(page, page_size, building, student_number, seat, reserve_status, classroom, name, appointment_time_start, appointment_time_end) {
  return request({
    url: `/reservation/condition`,
    method: "GET",
    params: {page, page_size, building, student_number, seat, reserve_status, classroom, name, appointment_time_start, appointment_time_end}
  })
}

POST:

该请求定义名为data的对象,在对象中填写属性。(注:在vue中传递参数时,参数不可转成json字符串)例如:

export function canSub(id) {
  return request({
    url: `/reservation/cancel`,
    method: "POST",
    data: {
      id
    }
  })
}

当需要获取后台返回过来的数据时,可以使用async await来修饰该方法,达到同步的效果,执行完该接口才继续向下进行

5.vue中出现#undefined的意思

在Vue.js的template标签中,“#”符号通常用于定义一些特殊的语法糖或指令。这种符号通常称为"hash"或"sharp"。

“#”为“v-slot”的缩写,用于在组件中定义插槽,#default表示默认插槽。

<template>
      <el-table :data="tableData">  //:data用于设置表格的表格头,值为一个数组
        <el-table-column prop="name" label="Name">  //prop用于遍历表格的列内容,值为上述数组中的元素。
          <!-- 使用插槽自定义列的内容 -->
          <template v-slot="{ row, column, $index }">  //
            <span>{{ row.name }}</span>    //row.name中的row为固定写法,后面的name为上面el-table-column中的prop的值,也可在里面写一些标签。
          </template>
        </el-table-column>
        <el-table-column prop="age" label="Age"></el-table-column>
        <!-- 其他 el-table-column --> //其他列内容
        </el-table-column>
      </el-table>
    </template>
6.接收返回值的三个单词的区别:

then,catch,finally,返回成功时程序进入then;返回失败时进入catch;无论是成功还是失败,最后都会进入finally并执行里面的代码。

7.使用阿里云合并代码时弹出框内四种合并方式的区别
  1. 创建一个合并节点(Create a Merge Commit):这个选项会在目标分支上创建一个新的合并节点,将源分支的修改合并进来。这样的合并会保留源分支的提交历史,并在目标分支上创建一个新的合并提交,用于记录合并操作。

  2. Squash合并(Squash Merge):Squash合并是一种将源分支的多个提交合并为一个单一提交的方式。合并后,目标分支会有一个新的提交,包含了所有源分支的修改。这种方式通常用于保持提交历史的整洁性,将一系列相关的提交合并为一个更简洁的提交。

  3. Rebase合并(Rebase Merge):Rebase合并是一种改写提交历史的方式。它将源分支的修改按照提交的时间顺序依次应用到目标分支上,创建一个新的提交历史。相比于创建合并节点,Rebase合并可以使提交历史更加线性,但可能会改写提交的哈希值,因此谨慎使用。

  4. Fast-forward-only合并(Fast-forward Only Merge):这个选项要求目标分支的HEAD指针可以直接快进(fast-forward)到源分支的HEAD。如果无法快进,合并将被拒绝。这通常用于保持提交历史的线性,并且只在目标分支没有新的提交的情况下才能执行。

每种合并方式都有其适用的场景,选择合适的方式取决于你的项目需求、团队工作流程以及个人偏好。例如,如果你希望保留详细的提交历史,你可能会选择创建一个合并节点或者使用Squash合并。如果你更注重线性的提交历史,可能会选择Rebase合并或Fast-forward-only合并。

8.启动指令

平时练习的时候启动指令一般都是 npm run dev ,在项目中可能会有所改变,查看方法如下:将项目拉下来后点击package.json=>查看scripts属性的preinstall属性值的最后一个单词A和preinstall属性下方的第一个属性B。启动指令就是:A run B。例如:

启动指令就是:pnpm run dev

三、项目感悟

在本次项目中,首先学会的就是分析代码。因为这次代码初始使用的是一个模板,再加上是第一次写项目,一开始的时候都不知道先在哪下手,通过问学长还有比我学习时间长的同学,最终找到了如何下手。之后又遇到了种种困难,最终耗时六天半天完成了三个页面。第一个页面因为是刚开始写,所以不知道如何下手,也不知道如何对接口,虽然这个页面只有三个接口,属于三个里面最简单的,但是仍然花费了三天半;第二个页面刚开始略微有点棘手,但是很快就找到节奏了,不到半天就写完了大部分接口,但是这个时候遇到了一个新问题——上传照片,控制台一直显示文件类型错误,但是我找了好多人都没解决,甚至还和,于是因为这个问题从中午整到晚上才解决,第二天又遇到一点小麻烦,用了一天才解决;第三个页面倒是没碰到什么特别新的问题,所以用了一天多一点就写完了。

经过本次项目,我学会了如何在远程仓库如何拉取代码还有如何将本地仓库的代码推送到远程仓库。在使用模板的时候知道了该如何分析项目的结构,该在哪写对接口。

最最重要的是经过这次事件,了解了只学习的弊病,只有真正做过项目才能知道该怎么应用学习过程中的知识。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值