vue学习笔记（购物车小案例）

news2024/11/16 4:32:05

用一个简单的购物车demo来回顾一下其中需要注意的细节。

先看一下最终效果

功能：

（1）全选按钮和下面的商品项的选中状态同步，当下面的商品全部选中时，全选勾选，反之，则不勾选。

（2）控制购物车商品数量，最低为1

（3）拥有小计和总计功能。其中，总计为勾选的商品所需要的总金额。

首先，先把静态页面写出来。

<template>
<div>
<h2>购物车</h2>
全选 <input type="checkbox" >
<div v-for="(item,index) in goods" :key="index">
<input type="checkbox" name="" id="" >

--商品名：{{ item.name }}  --价格：{{ item.price }} 
<!-- 后端数据没有item.num,就使用或1的形式给所有商品默认的数量为1，这样就不用一个个在后端数据中加了 -->
--<button type="button" >+</button>{{item.num || 1}}<button  >-</button>
--小计：0
</div>
<div>总计：0</div>
</div>

</template>

上面的代码将静态页面写了出来，目前没有任何功能而。我们一一进行功能的添加。首先，实现简单的数量加减和小计。

思路：

现在存在两种情况，

第一，就是后端返回了商品数量，也就是item.num这个数据后端是直接给你的，然后我们直接进行使用即可。但是，实际的情况是后端返回的数量是这个商品的总库存，作为我们的购物车来说，一般默认的数量是为1的。所以，这里我们使用逻辑运算符的情况考虑了两种情况。

然后就是加一和减一，比较容易的方法就是直接给加和减分别绑定点击事件，分别进行加减，这里需要使用两个方法。这样的方法就不再介绍。不如换一个思路，让两个事件使用同一个事件，这样就少写了一个方法。

就是两者都是加，而减的操作是加-1.这样就可以合并为一个方法。

代码如下

updateNum(actionType,index){
      //初始化num
      this.goods[index].num = this.goods[index].num||1

      //数量操作
      this.goods[index].num+=actionType

    },

解释一下，第一个参数就是传递过来的值，是加1，还是加-1，第二个值就是对应的索引，因为要对对应的商品进行数量加减操作，所以需要对应商品的索引。

首先，在考虑初始化num的时候，也要考虑num不存在的情况，

然后进行对应的数量操作即可。

那么我们的小计也就可以根据商品数量和价格进行计算了，注意：也要考虑数量不存在的情况。

对应的代码为：

<button type="button" @click="updateNum(1,index)">+</button>{{item.num || 1}}
<button   @click="updateNum(-1,index)">-</button>
--小计：{{(item.num ||1) *item.price}}
</div>

然后就是全选，商品单选，和总计的功能了。

首先进行全选实现，就是让全选的状态和商品单选进行同步。

我们首先定义全选的状态，默认是不选中的。（ isAllSelected:false,）

 data(){
    return{
      isAllSelected:false,
      goods:[{
        name:"商品1",
        price:"100",
        // num:"1",
      },
      {
        name:"商品2",
        price:"200"
      },
      {
        name:"商品3",
        price:"300"
      }]
    }
  },

然后对应的给他添加change事件（注意，这里是change事件，并不是click）

全选 <input type="checkbox" :checked="isAllSelected" @change="allSelect">

使用动态绑定属性使他与 isAllSelected:的状态同步，然后写allSelect方法

allSelect(){
      this.isAllSelected=!this.isAllSelected
      console.log(this.isAllSelected);

      //同步单选状态
      this.goods.forEach(item=>{
        item.select=this.isAllSelected
      })
    },

这里就是让他的状态和下面的商品列表的选择框进行同步，思路为：就是对下面的商品列表进行遍历，使用forEach方法，并将其状态赋值给每一项商品的选择状态。

然后就是当下面的每一项的商品取消选中时，那个全选的状态要进行改变。

这里用到另一个数组方法every

singleSelect(index){
      //修改当前单选商品状态
      this.goods[index].select=!this.goods[index].select

      //使用every方法循环数组，如果有一个select为false
      //整个结果为false 全部为true 整个结果为true
      //和我们单选联动 全选逻辑一致
      //直接使用返回值 赋给全选状态
      this.isAllSelected=this.goods.every(item=>item.select)
    }

最后就是总计了，这里的总计是将所有选中的商品进行金额的计算。

这里也是用到了两个数组方法，他们分别是filter和every。

<div>总计：{{ goods.filter(item=>item.select).reduce((total,item)=>total+=item.price*(item.num ||1),0) }}</div>

然后解释一下，这里首先使用filter方法将满足选中状态的商品进行过滤，返回的是一个数组，然后再将返回的数组使用累加方法reduce进行金额的计算。

完整代码附上：

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2024-07-06 16:18:52
 * @LastEditors: Mei
 * @LastEditTime: 2024-07-06 17:03:12
 * @FilePath: \Fighting\new_project_0705\my-vue-app\src\components\shopcar.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>
<div>
<h2>购物车</h2>
全选 <input type="checkbox" :checked="isAllSelected" @change="allSelect">
<div v-for="(item,index) in goods" :key="index">
<input type="checkbox" name="" id="" :checked="item.select" @change="singleSelect(index)">

--商品名：{{ item.name }}  --价格：{{ item.price }} 
<!-- 后端数据没有item.num,就使用或1的形式给所有商品默认的数量为1，这样就不用一个个在后端数据中加了 -->
--<button type="button" @click="updateNum(1,index)">+</button>{{item.num || 1}}<button   @click="updateNum(-1,index)">-</button>
--{{(item.num ||1) *item.price}}
</div>
<div>总计：{{ goods.filter(item=>item.select).reduce((total,item)=>total+=item.price*(item.num ||1),0) }}</div>
</div>

</template>

<script>
export default {
  data(){
    return{
      isAllSelected:false,
      goods:[{
        name:"商品1",
        price:"100",
        // num:"1",
      },
      {
        name:"商品2",
        price:"200"
      },
      {
        name:"商品3",
        price:"300"
      }]
    }
  },
  methods:{
    updateNum(actionType,index){
      //初始化num
      this.goods[index].num = this.goods[index].num||1

      //数量操作
      this.goods[index].num+=actionType

    },

    allSelect(){
      this.isAllSelected=!this.isAllSelected
      console.log(this.isAllSelected);

      //同步单选状态
      this.goods.forEach(item=>{
        item.select=this.isAllSelected
      })
    },
    singleSelect(index){
      //修改当前单选商品状态
      this.goods[index].select=!this.goods[index].select

      //使用every方法循环数组，如果有一个select为false
      //整个结果为false 全部为true 整个结果为true
      //和我们单选联动 全选逻辑一致
      //直接使用返回值 赋给全选状态
      this.isAllSelected=this.goods.every(item=>item.select)
    }
  }
}
</script>


<style>

</style>

通过这个案例，主要是复习一下vue的常见指令的使用，主要是数组方法的使用。这里，将使用的四个数组方法进行详细的介绍。

①forEach

forEach 是 JavaScript 中的一个数组方法，它允许你对数组中的每个元素执行一个函数。这个方法接受一个回调函数作为参数，这个回调函数会对数组中的每个元素执行一次。此外，forEach 方法不会返回一个新数组，它仅仅是对原数组的每个元素执行了提供的函数。

forEach 的基本语法如下：


array.forEach(function(currentValue, index, arr), thisArg)
参数说明：

currentValue：数组中正在处理的当前元素。
index（可选）：数组中正在处理的当前元素的索引。
arr（可选）：forEach() 方法正在操作的数组。
thisArg（可选）：执行回调函数时用作 this 的对象。

上面是官方的介绍，但是在实际的使用中，用的最多的还是currentValue，偶尔也会用到index，这里用一个上次的案例进行效果演示。（主要是遍历数组，记住不会返回新数组就行了）

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2024-07-05 21:28:45
 * @LastEditors: Mei
 * @LastEditTime: 2024-07-06 17:39:19
 * @FilePath: \Fighting\new_project_0705\my-vue-app\src\components\practice5.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>

  <div>
    <div id="myList" v-for="(item,index) in arr" :key="index" @click="arrTest">{{ item.name }}

    </div>
  </div>

</template>


<script>
//列表渲染
//为什么循环的时候需要加key
//1.key的作用主要是为了高效的更新虚拟Dom，提高渲染性能
//2.key属性可以避免数据混乱的情况出现
export default{
  data(){
    return{
      arr:[{
        name:"张三"
      },
    {
      name:"李四"
    },
  {
    name:"王五"
  }]
    }
  },
  methods:{
    arrTest(){
      this.arr.forEach((item,index)=>{
        console.log("我是每一项",item);
        console.log("我是每一项的索引",index);
      })
    }
  }
}

</script>

<style scoped>
#myList{
  color: blue;
  background-color: yellow;
  margin-top: 20px;
}
</style>

效果如下：

②every

every 是 JavaScript 中的一个数组方法，用于测试数组的所有元素是否都满足提供的函数中的测试条件。如果所有元素都通过测试，则返回 true；否则，返回 false。这个方法不会改变原数组，而是返回一个布尔值。

every 方法的基本语法如下：

array.every(function(currentValue, index, arr), thisArg)


参数说明：

currentValue：数组中正在处理的当前元素。
index（可选）：数组中正在处理的当前元素的索引。
arr（可选）：every 方法正在操作的数组。
thisArg（可选）：执行回调函数时用作 this 的值。如果省略了 thisArg 参数，或者设为 null 或 undefined，则 this 会被视为全局对象。在严格模式下，如果省略或为 null 或 undefined，则 this 会是 undefined。

还是一个案例来演示：

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2024-07-05 21:28:45
 * @LastEditors: Mei
 * @LastEditTime: 2024-07-06 17:53:54
 * @FilePath: \Fighting\new_project_0705\my-vue-app\src\components\practice5.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>

  <div>
    <div id="myList" v-for="(item,index) in arr" :key="index" @click="arrTest">{{ item.name }}
      
    </div>
    <div>
      <button @click="arrTest2">点我看every{{ testEvery }}</button>
    </div>
  </div>

</template>


<script>
//列表渲染
//为什么循环的时候需要加key
//1.key的作用主要是为了高效的更新虚拟Dom，提高渲染性能
//2.key属性可以避免数据混乱的情况出现
export default{
  data(){
    return{
      testEvery:"",
      arr:[{
        name:"张三"
      },
    {
      name:"李四"
    },
  {
    name:"王五"
  }],
  arr2:[{
    age:10
  },
  {
    age:20
  },
  {
    age:30
  }]
    }
  },
  methods:{
    arrTest(){
      this.arr.forEach((item,index)=>{
        console.log("我是每一项",item);
        console.log("我是每一项的索引",index);
      })
    },
    arrTest2(){
      this.testEvery=this.arr2.every((item,index)=>{
        return item.age>5
      })
      
    }
  }
}

</script>

<style scoped>
#myList{
  color: blue;
  background-color: yellow;
  margin-top: 20px;
}
</style>

写一个按钮，当我们点击按钮的时候，就可以看到arrTest2返回的值，我们可以看到多了一个true，因为在执行every后，this.testEvery=true，对应页面的testEvery值也会进行显示。

③filter

filter 是 JavaScript 中的一个非常有用的数组方法，它创建一个新的数组，该数组包含通过测试函数的所有元素。换句话说，filter 方法会遍历原数组，对每个元素执行一个测试函数，如果该函数返回 true，则将该元素包含在新数组中。

filter 方法的基本语法如下：
let newArray = array.filter(function(currentValue, index, arr), thisArg)


参数说明：

currentValue：数组中正在处理的当前元素。
index（可选）：数组中正在处理的当前元素的索引。
arr（可选）：filter 方法正在操作的数组。
thisArg（可选）：执行回调函数时用作 this 的值。
filter 方法返回一个新数组，该数组包含原数组中满足测试函数的元素。它不会改变原数组。

上代码

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2024-07-05 21:28:45
 * @LastEditors: Mei
 * @LastEditTime: 2024-07-06 18:03:11
 * @FilePath: \Fighting\new_project_0705\my-vue-app\src\components\practice5.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>

  <div>
    <div id="myList" v-for="(item,index) in arr" :key="index" @click="arrTest">{{ item.name }}
      
    </div>
    <div>
      <button @click="arrTest2">点我看Filter</button>
      <div v-for="(item,index) in testFilter " :key=index>{{ item.age }}</div>
    </div>
  </div>

</template>


<script>
//列表渲染
//为什么循环的时候需要加key
//1.key的作用主要是为了高效的更新虚拟Dom，提高渲染性能
//2.key属性可以避免数据混乱的情况出现
export default{
  data(){
    return{
      testEvery:"",
      testFilter:"",
      arr:[{
        name:"张三"
      },
    {
      name:"李四"
    },
  {
    name:"王五"
  }],
  arr2:[{
    age:10
  },
  {
    age:20
  },
  {
    age:30
  }]
    }
  },
  methods:{
    arrTest(){
      this.arr.forEach((item,index)=>{
        console.log("我是每一项",item);
        console.log("我是每一项的索引",index);
      })
    },
    arrTest2(){
      this.testFilter=this.arr2.filter((item,index)=>{
        return item.age>15
      })
      console.log(this.testFilter);
      
    }
  }
}

</script>

<style scoped>
#myList{
  color: blue;
  background-color: yellow;
  margin-top: 20px;
}
</style>

当我点击按钮后，对应返回的新数组就会被渲染出来。

④reduce

reduce 是 JavaScript 中的一个数组方法，用于将数组中的所有元素通过某个函数（称为“reducer”函数）归并成一个单一的结果。这个方法会遍历数组中的每个元素，并使用 reducer 函数将其累积成一个单一的值。

reduce 方法的基本语法如下：
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)


参数说明：

function(total, currentValue, currentIndex, arr): 这是 reducer 函数，它接受四个参数：
total（必需）：初始值，或者计算结束后的返回值（累加器）。
currentValue（必需）：当前元素。
currentIndex（可选）：当前元素的索引。
arr（可选）：当前元素所属的数组对象。
initialValue（可选）：传递给函数的初始值。如果没有提供初始值，则将使用数组的第一个元素作为初始值，并从数组的第二个元素开始进行迭代。

上代码：

<!--
 * @Author: RealRoad1083425287@qq.com
 * @Date: 2024-07-05 21:28:45
 * @LastEditors: Mei
 * @LastEditTime: 2024-07-06 18:11:41
 * @FilePath: \Fighting\new_project_0705\my-vue-app\src\components\practice5.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>

  <div>
    <div id="myList" v-for="(item,index) in arr" :key="index" @click="arrTest">{{ item.name }}
      
    </div>
    <div>
      <button @click="arrTest2">点我看Filter</button>
      <div v-for="(item,index) in testFilter " :key=index>{{ item.age }}</div>

      <button @click="arrTest3">点我看Reduce</button>
      <!-- <div v-for="(item,index) in testFilter " :key=index>{{ item.age }}</div> -->
    </div>
  </div>

</template>


<script>
//列表渲染
//为什么循环的时候需要加key
//1.key的作用主要是为了高效的更新虚拟Dom，提高渲染性能
//2.key属性可以避免数据混乱的情况出现
export default{
  data(){
    return{
      testEvery:"",
      testFilter:"",
      testReduce:0,
      arr:[{
        name:"张三"
      },
    {
      name:"李四"
    },
  {
    name:"王五"
  }],
  arr2:[{
    age:10
  },
  {
    age:20
  },
  {
    age:30
  }]
    }
  },
  methods:{
    arrTest(){
      this.arr.forEach((item,index)=>{
        console.log("我是每一项",item);
        console.log("我是每一项的索引",index);
      })
    },
    arrTest2(){
      this.testFilter=this.arr2.filter((item,index)=>{
        return item.age>15
      })
      console.log(this.testFilter);
      
    },
    arrTest3(){
      this.testReduce=this.arr2.reduce((total,item)=>{
        return total+item.age
      },0)
      console.log(this.testReduce);
      
    }
  }
}

</script>

<style scoped>
#myList{
  color: blue;
  background-color: yellow;
  margin-top: 20px;
}
</style>

我的年龄数据为10,20,30,他们累加之后为60，如果在最后一项，我不是以0为初始值，更改为1后，累加的值就变成了61. 

 this.testReduce=this.arr2.reduce((total,item)=>{
        return total+item.age
      },0)

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1901123.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

最短路：Dijkstra

最短路：Dijkstra

原始模板&#xff1a; 时间复杂度O() 使用于图很满的情况 struct Node{int y,v;Node(int _y,int _v){y_y;v_v;} };vector<Node> edge[N1]; int n,m,dist[N1]; bool b[N1];int Dijistra(int s,int t){memset(b,false,sizeof(b));memset(dist,127,sizeof(dist));dist[s]…
阅读更多...
Windows 11文件资源管理器选项卡的4个高级用法，肯定有你喜欢的

Windows 11文件资源管理器选项卡的4个高级用法，肯定有你喜欢的

作为一个每天使用文件资源管理器来管理我的工作流程的人，选项卡帮助我为处于不同完成阶段的工作创建了不同的文件夹。以下是我使用选项卡提高工作效率的最佳技巧。 打开和关闭选项卡 假设你的计算机上安装了Windows 11的最新更新，请按Ctrl+E打开文件资源管理器。在我发现“…
阅读更多...
软件工程学面向对象

软件工程学面向对象

一、面向对象方法学概述 传统的生命周期方法学在消除软件非结构化、促进软件开发工程化方面起了积极的作用&#xff0c;但仍有许多不足&#xff0c;存在的主要问题有&#xff1a;①生产率提高的幅度不能满足需要&#xff1b; ②软件重用程度很低&#xff1b; ③软件很难维护&a…
阅读更多...
Canary，三种优雅姿势绕过

Canary，三种优雅姿势绕过

Canary&#xff08;金丝雀&#xff09;&#xff0c;栈溢出保护 canary保护是防止栈溢出的一种措施&#xff0c;其在调用函数时&#xff0c;在栈帧的上方放入一个随机值 &#xff0c;绕过canary时首先需要泄漏这个随机值&#xff0c;然后再钩爪ROP链时将其作为垃圾数据写入&…
阅读更多...
Python数据分析案例50——基于EEMD-LSTM的石油价格预测

Python数据分析案例50——基于EEMD-LSTM的石油价格预测

案例背景 很久没更新时间序列预测有关的东西了。 之前写了很多CNN-LSTM&#xff0c;GRU-attention&#xff0c;这种神经网络之内的不同模型的缝合&#xff0c;现在写一个模态分解算法和神经网络的缝合。 虽然eemd-lstm已经在学术界被做烂了&#xff0c;但是还是很多新手小白或…
阅读更多...
Go 中的类型推断

Go 中的类型推断

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…
阅读更多...
HDF4文件转TIF格式

HDF4文件转TIF格式

HDF4 HDF4&#xff08;Hierarchical Data Format version 4&#xff09;是一种用于存储和管理机器间数据的库和多功能文件格式。它是一种自描述的文件格式&#xff0c;用于存档和管理数据。 HDF4与HDF5是两种截然不同的技术&#xff0c;HDF5解决了HDF4的一些重要缺陷。因此&am…
阅读更多...
【文献解析】Voxelmap——一种自适应体素地图

【文献解析】Voxelmap——一种自适应体素地图

Efficient and Probabilistic Adaptive Voxel Mapping for Accurate Online LiDAR Odometry 论文地址&#xff1a;https://ieeexplore.ieee.org/stamp/stamp.jsp?tp&arnumber9813516 代码&#xff1a;GitHub - hku-mars/VoxelMap: [RA-L 2022] An efficient and probabili…
阅读更多...
DatawhaleAI夏令营2024 Task2

DatawhaleAI夏令营2024 Task2

#AI夏令营 #Datawhale #夏令营 赛题解析一、Baseline详解1.1 环境配置1.2 数据处理任务理解2.3 prompt设计2.4 数据抽取 二、完整代码总结 赛题解析 赛事背景 在数字化时代&#xff0c;企业积累了大量对话数据&#xff0c;这些数据不仅是交流记录&#xff0c;还隐藏着宝贵的信…
阅读更多...
2000-2022年地级市数字经济指数（含控制变量）

2000-2022年地级市数字经济指数（含控制变量）

2000-2022年地级市数字经济指数&#xff08;含控制变量&#xff09; 目录 数字经济对区域经济发展的影响实证研究 一、引言 二、文献综述 三、数据来源与变量说明 四、实证模型 五、程序代码与运行结果 数字经济对区域经济发展的影响实证研究 摘要&#xff1a; 本文旨在…
阅读更多...
Git-Unity项目版本管理

Git-Unity项目版本管理

目录 准备GitHub新建项目并添加ssh密钥Unity文件夹 本文记录如何用git对unity 项目进行版本管理&#xff0c;并可传至GitHub远端。 准备 名称版本windows11Unity2202.3.9.f1gitN.A.githubN.A. GitHub新建项目并添加ssh密钥 GitHub新建一个repositorywindows11 生成ssh-key&…
阅读更多...
数字信号处理中的难点

数字信号处理中的难点

数字信号处理中的难点可以归纳为多个方面&#xff0c;这些难点不仅体现在理论知识的理解和掌握上&#xff0c;还涉及到实际工程应用中的各种问题。以下是对这些难点的详细分析&#xff1a; 一、理论知识的难点 信号与系统的基本概念&#xff1a; 理解和区分连续时间信号与离…
阅读更多...
数字时代如果你的企业还未上线B端系统助力则后果很严重

数字时代如果你的企业还未上线B端系统助力则后果很严重

**数字时代如果你的企业还未上线B端系统助力则后果很严重** 数字化浪潮席卷全球&#xff0c;企业对于数字化转型的重视程度日益提高。B端系统&#xff0c;作为企业数字化转型的核心组成部分&#xff0c;其重要性不言而喻。如果你的企业还未上线B端系统助力&#xff0c;那么后果…
阅读更多...
3-3 超参数

3-3 超参数

3-3 超参数 什么是超参数 超参数也是一种参数&#xff0c;它具有参数的特性&#xff0c;比如未知&#xff0c;也就是它不是一个已知常量。是一种手工可配置的设置&#xff0c;需要为它根据已有或现有的经验&#xff0c;指定“正确”的值&#xff0c;也就是人为为它设定一个值&…
阅读更多...
美国国家航空航天局（NASA）的载人登月计划：阿耳忒弥斯计划

美国国家航空航天局（NASA）的载人登月计划：阿耳忒弥斯计划

本文首发于公众号“AntDream”&#xff0c;欢迎微信搜索“AntDream”或扫描文章底部二维码关注&#xff0c;和我一起每天进步一点点 Artemis计划是美国国家航空航天局&#xff08;NASA&#xff09;主导的一项雄心勃勃的月球探索计划&#xff0c;旨在2020年代重新将人类送上月球…
阅读更多...
SpringBoot+OSS实现文件上传

SpringBoot+OSS实现文件上传

创建spring boot项目 pom依赖 <dependency><groupId>com.aliyun.oss</groupId><artifactId>aliyun-sdk-oss</artifactId><version>3.17.4</version></dependency><dependency><groupId>javax.xml.bind</groupI…
阅读更多...
拉普拉斯逆变换

拉普拉斯逆变换

https://www.bilibili.com/video/BV17i4y1475Y?p21&vd_source2e6b4ba548ec9462b2f9633ff700e9b9 CV 17 陈永平教授关于拉普拉斯逆变换的式子的推导 最关键的两步 想到取一个合适的contour L R L_R LR​部分是实部 γ \gamma γ要大于所有极点的实部,这样就可以搞一个大…
阅读更多...
C++：二维数组的遍历

C++：二维数组的遍历

方式一&#xff1a; #include <vector> #include <iostream> int main() { // 初始化一个2x3的二维向量&#xff08;矩阵&#xff09; std::vector<std::vector<float>> matrix { {1.0, 2.0, 3.0}, // 第一行 {4.0, 5.0, 6.0} // 第二行 };…
阅读更多...
CV03_mAP计算以及COCO评价标准

CV03_mAP计算以及COCO评价标准

COCO数据集回顾&#xff1a;CV02_超强数据集&#xff1a;MSCOCO数据集的简单介绍-CSDN博客 1.1 简介 在目标检测领域中&#xff0c;mAP&#xff08;mean Average Precision&#xff0c;平均精度均值&#xff09;是一个广泛使用的性能评估指标&#xff0c;用于衡量目标检测模型…
阅读更多...
IDEA如何引入外部jar包

IDEA如何引入外部jar包

导了3次&#xff0c;记不住&#xff0c;写篇博客记一下&#xff1b; 1、File->Project Structure->项目名称->JARs or Dircetories... 2、选择所要导入的jar包【可多选】&#xff1b;此处图片略&#xff1b; 3、选中后点击确定&#xff0c;jar会显示在idea的目录中&…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023