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

这篇文章主要为大家详细介绍了vue实现添加与删除图书功能，具有一定的参考价值，可以用来参考一下。

感兴趣的小伙伴，下面一起跟随四海网的小编两巴掌来看看吧！

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

【图片暂缺】

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

我们先来看看splice的用法。

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

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

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

【图片暂缺】

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

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

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

【图片暂缺】

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

【图片暂缺】

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

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

总结

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

本文来自：http://www.q1010.com/184/6775-0.html

注：关于vue实现添加与删除图书功能的内容就先介绍到这里，更多相关文章的可以留意四海网的其他信息。

关键词：vue.js