今天主要踩的坑有:
1.前端Vue的生命钩子,在页面打开的时候动态加载数据库中的值。
2.使用路由传参 实现点击某一篇文章可以从后台获取对应的数据
3.阅读文章时可以进行修改文章
4.添加评论
生命钩子
尤其主要记住,后端传axios的值为一个数组,如果为单个对象记得data[0],多个数据用v-for取出来。
这是将输入的东西发送给后台写入数据库.
路由传参
有三种传参方式 详情参参考三种路由传参。
我用的是vuetifyUI组件库,里面集成度很高,直接使用to或者**:to都可以。
因为我使用传的是一个对象,所以需要加:**。对应路由中使用该对象的参数:
修改文章
利用到了路由传参的方式。
将本篇文章的ID传入添加文章页面。
添加文章页面用生命钩子进行加载 判断是否传参,传参则从数据库按ID取文章的内容,否则进行正常的添加文章操作
添加评论
上操作:
进入页面时进行加载,当文章内容和评论同时加载,当添加评论结束后对评论区进行重新加载
删除评论和删除文章
删除评论使用了参数,越学到后面啥都记不起了,参数的 重要性。
删除文章的代码也贴上:
为了显得删除更加高级,用了对话框。
基本上增删查改都完成了。