自学内容网 自学内容网

项目小总结

这段时间主要把大概的开发流程了解完毕

修改了,并画了几个界面

一.界面

修改为

博客主页

个人中心

二.前后端分离开发

写前端时

就可以假设拿到这些数据了

const blogData2 =  {
    blog:{
        id:1,
        title: "如何编程飞人",
        author_id: 1,
        content: "这是一篇关于如何成为编程飞人的文章。",
        publishTime: "2022-05-05 12:00:00",
        likeNum: 2,
        readNum: 101,
        commentNum: 10,
        collectionNum: 10
    },
    tags:[
        {id:1, name:"java"},
        {id:2, name:"python"},
        {id:3, name:"c++"}
    ],
    isCollection: false,
    isLiked: false,
    isFollowed: false,
    comments: [
        {id:1, avatarUrl:"#", author: "Alice", content: "Great blog!", parentCommentId: -1, likeNum: 0 },
        {id:2, avatarUrl:"#", author: "Bob", content: "Very informative!", parentCommentId: 1, likeNum: 0}
    ]
};

 然后后面就可以直接引用这个数据

得到数据的值

后端同样可以根据这个数据和请求,进行响应数据

,就可以进行分离操作

后端

可以返回一个前端操作数据对象(json格式)

这样可以直接取到返回数据的值。

三.开发中的坑

(设置双token检测)拦截器时:使用axios进行执行拦截器的收发请求,再HTML文件中需要导入axios包

如果导入axios包,进行定义拦截器(单独写一个js文件),那末从在html文件中利用这个时,就需要导入这个包,

<script src="./axios-0.18.0.js"></script>
  <script   src="./js/interceptorRR.js" type="module"></script>

如果不写这个type=’module‘就会出现这个错误

Cannot use import statement outside a module

这里就把这个拦截器导入进来了,如果你要是使用

需要在js代码块中引入这个

就会导致浏览器找不到这个资源

还有一个坑就是

当你的前端使用这样响应事件时,你的javaScript的type不能是module

不然就会找不到这个方法


原文地址:https://blog.csdn.net/2301_80311013/article/details/142371702

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!