编程 Javascript

vue实现添加与删除图书功能

Posted in Javascript onOctober 07, 2018

先放大图，当我们点击删除的时候，图书名单就会被我们删掉。当我们重新添加回来或者添加新书的时候，我们只需要在添加新书这里添加即可。

vue实现添加与删除图书功能

当我点击删除的时候，只需要的就是除却删除的那一个书籍之后剩下的图书。

我们先来看看splice的用法。

splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。

注释：该方法会改变原始数组

故在删除书籍中我们会用到的方法是

vue实现添加与删除图书功能

删掉idx位置的那一种书，返回剩下的新的书籍数组。

当我们点击添加新书的时候，如果新书的id值比之前的书籍列表的值大，就添加在书籍末尾，否则就添加在对应的id处。

我们来看看添加书籍的代码

vue实现添加与删除图书功能

我们再来看看此demo的详细代码

vue实现添加与删除图书功能

本文升华自图书管理实战视频

此详细demo见我的github:https://github.com/JserJser/reactWebApp/tree/master/vue-cdn

总结

以上所述是小编给大家介绍的vue实现添加与删除图书功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

vue实现添加与删除图书功能

- Author -

jser_dimple

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jQuery的一些注意

Dec 06 Javascript

JavaScript 中的事件教程

Apr 05 Javascript

拖动布局之保存布局页面cookies篇

Oct 29 Javascript

JS打开新窗口防止被浏览器阻止的方法

Jan 03 Javascript

jquery实现简洁文件上传表单样式

Nov 02 Javascript

JavaScript操作select元素和option的实例代码

Jan 29 Javascript

Bootstrap Table的使用总结

Oct 08 Javascript

EditPlus 正则表达式实战(3)

Dec 15 Javascript

微信小程序wx.uploadfile 本地文件转base64的实现代码

Jun 28 Javascript

利用jqgrid实现上移下移单元格功能

Nov 07 Javascript

详解javascript replace高级用法

Feb 17 Javascript

javascript实现随机抽奖功能

Dec 30 Javascript

JavaScript检查数据中是否存在相同的元素（两种方法）

Oct 07 #Javascript

JS函数内部属性之arguments和this实例解析

Oct 07 #Javascript

JS如何获取地址栏的参数实例讲解

Oct 06 #Javascript

详谈js的变量提升以及使用方法

Oct 06 #Javascript

浅析js中mvvm模式实现的原理

Oct 06 #Javascript

js for终止循环跳出多层循环

Oct 04 #Javascript

iView-admin 动态路由问题的解决方法

Oct 03 #Javascript

You might like

星际争霸兵种名称对照表

2020/03/04 星际争霸

re0第二季蕾姆被制作组打入冷宫！艾米莉亚女主扶正，原因唏嘘

2020/04/02 日漫

php中的三元运算符使用说明

2011/07/03 PHP

PHP 第二节数据类型之数值型

2012/04/28 PHP

浅谈apache和nginx的rewrite的区别

2013/02/22 PHP

浅析Yii中使用RBAC的完全指南(用户角色权限控制)

2013/06/20 PHP

PHP读取word文档的方法分析【基于COM组件】

2017/08/01 PHP

PHP 实现人民币小写转换成大写的方法及大小写转换函数

2017/11/17 PHP

PHP面向对象程序设计之多态性的应用示例

2018/12/19 PHP

javaScript对象和属性的创建方法

2007/01/15 Javascript

jquery分页插件AmSetPager(自写)

2013/04/15 Javascript

Javascript级联下拉菜单以及AJAX数据验证核心代码

2013/05/10 Javascript

jquery实现增加删除行的方法

2015/02/03 Javascript

JS实现统计复选框选中个数并提示确定与取消的方法

2015/07/01 Javascript

JavaScript包装对象使用详解

2015/07/09 Javascript

jQuery中each()、find()和filter()等节点操作方法详解(推荐)

2016/05/25 Javascript

基于vuejs+webpack的日期选择插件

2020/05/21 Javascript

vue2.0实战之基础入门（1）

2017/03/27 Javascript

Angular.js通过自定义指令directive实现滑块滑动效果

2017/10/13 Javascript

解决在vue项目中webpack打包后字体不生效的问题

2018/09/01 Javascript

详解vue中使用微信jssdk

2019/04/19 Javascript

微信小程序 Storage更新详解

2019/07/16 Javascript

JS求解两数之和算法详解

2020/04/28 Javascript

JavaScript数组排序功能简单实现

2020/05/14 Javascript

typescript配置alias的详细步骤

2020/08/12 Javascript

vue+axios 拦截器实现统一token的案例

2020/09/11 Javascript

Openlayers绘制地图标注

2020/09/28 Javascript

详解Django框架中的视图级缓存

2015/07/23 Python

Python如何使用字符打印照片

2020/01/03 Python

django有哪些好处和优点

2020/09/01 Python

医学专业应届生的自我评价

2014/02/28 职场文书

竞聘自述材料

2014/08/25 职场文书

爱护环境卫生倡议书

2015/04/29 职场文书

道歉情书大全

2015/05/12 职场文书

PostgreSQL存储过程实用脚本(二)：创建函数入门

2021/04/05 PostgreSQL

python的变量和简单数字类型详解

2021/09/15 Python