vue实现添加与删除图书功能
- 更新时间：2022-12-01 08:51:07
- 编辑：姜凯定
先放大图，当我们点击删除的时候，图书名单就会被我们删掉。当我们重新添加回来或者添加新书的时候，我们只需要在添加新书这里添加即可。
当我点击删除的时候，只需要的就是除却删除的那一个书籍之后剩下的图书。
我们先来看看splice的用法。
splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。
注释：该方法会改变原始数组
故在删除书籍中我们会用到的方法是
删掉idx位置的那一种书，返回剩下的新的书籍数组。
当我们点击添加新书的时候，如果新书的id值比之前的书籍列表的值大，就添加在书籍末尾，否则就添加在对应的id处。
我们来看看添加书籍的代码
我们再来看看此demo的详细代码
本文升华自图书管理实战视频
此详细demo见我的github:https://github.com/JserJser/reactWebApp/tree/master/vue-cdn
总结
以上所述是小编给大家介绍的vue实现添加与删除图书功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
相关教程
-
vue数据劫持的原理
这篇文章主要介绍了3分钟了解vue数据劫持的原理实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
发布时间：2020-02-20
-
用Cordova打包Vue项目的方法步骤
这篇文章主要介绍了教你用Cordova打包Vue项目的方法，详细的介绍了如何Vue项目打包成app，具有一定的参考价值，有兴趣的可以了解一下
发布时间：2020-02-18
-
vue中使用heatmapjs的实例详解
这篇文章主要介绍了vue中使用heatmapjs的示例代码（结合百度地图），小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
发布时间：2020-07-16
-
vue组件高级用法实例详解
给网友朋友们带来一篇关于vue的教程，这篇文章主要介绍了vue 组件高级用法,需要的朋友可以参考下
发布时间：2022-06-22
-
详解vue项目接入微信JSSDK的坑
给大家整理了关于vue的教程，这篇文章主要介绍了详解vue项目接入微信JSSDK的坑,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
发布时间：2022-06-17
-
vue和mintui-Loadmore结合实现下拉刷新上拉加载实例效果
本篇文章主要介绍了vue mintui-Loadmore结合实现下拉刷新和上拉加载示例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
发布时间：2020-02-11
-
vue2.0中proxyTable用axios进行跨域请求的设置方法
这篇文章主要介绍了vue2.0设置proxyTable使用axios进行跨域请求，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
发布时间：2020-01-02
-
vue使用vue-i18n实现国际化代码详解
本篇文章主要介绍了vue使用vue-i18n实现国际化的实现代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
发布时间：2020-01-31
-
Vue实现双向绑定的原理以及响应式数据的实例代码
这篇文章主要介绍了Vue实现双向绑定的原理以及响应式数据的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
发布时间：2020-04-10
-
Vue.js中使用Mixins的方法详解
本篇文章主要介绍了在Vue.js中使用Mixins的方法，Vue的Mixins是非常实用的编程方式，可以使代码变得容易理解，有兴趣的一起来了解一下
发布时间：2020-06-03
