我说

有的东西看完马上就忘,收藏的文章也从来没有回头看过,试试自己写一个!!!!希望可以坚持,以后把遇到的插件/工具记录在这里,如果有哪里错了(我这个小垃圾肯定会出错啊!!!!!!),请大家帮我指出,最后希望这个记录可以坚持下去

一 moment

含义:是一个处理日期和事件的插件

使用:

• 安装 npm i moment
• 引入
• 在过滤器中使用

......
//下面注册一个全局的过滤器
Vue.filter('msg1',(res,data)=>{
    return moment(res).format(data)
})
......
//使用msg1这个过滤器(这里假设vm实例的data中有data1这个数据)
<div id="app">
<!--在msg1中传了参数YYYY,表示将日期处理成只显示年份-->
    <div>{{data1|msg1("YYYY")}}</div>
</div>

二 json-server

含义 提供假数据==>根据一个.json文件生成一个接口 使用步骤

• 下载 npm run json-server -g 全局安装当成一个工具使用
• 在终端 json-server 文件名生成接口

用REST API的方式请求数据

• 查找 :get
• 添加 :post
• 删除 :delete
• 更改 :put/patch----------------据说前端更欢喜后者而后端更喜欢前者

注意:put和patch的区别: PUT 需要提供该对象的所有数据PATCH 只需要提供要修改的数据即可

因为不清楚 REST API稍微百度了一下REST API的使用

可以借助postman 测试接口

三 axios

含义: 这是一个基于Promise的请求工具库,封装了ajax，用来发送请求，异步获取数据 适用于 浏览器和node

使用

• 安装: npm i axios
• 导入 axios
• 使用 axios 使用说明

//发送get请求所有数据
//axios.get("请求地址",()=>{})
 axios.get('http://localhost:3000/list').then(res => {
  console.log(res);
})
//请求具体的数据
//方式1...直接/后面跟着id
 axios.get('http://localhost:3000/list/1').then(res => {
  console.log(res);
})
//方式2 ...在地址后传一个对象
 axios.get('http://localhost:3000/list',{ params: {id: 1}}).then(res => {
  console.log(res);
})

<!--分割线-->

//发送post请求,添加数据
//注意不用指定id会自动追加
axios.post('http://localhost:3000/list',{name:"小仙女",done:"false"}).then(res => {
  console.log(res);
})

<!--分割线-->
//发送delete删除请求
//在路径后凭借要删除的数据的id
//注意 状态码为200 不代表就成功了 还要确认一下`data`的答应结果是否为空
axios.delete('http://localhost:3000/list/1').then(res => {
  console.log(res);
})

<!--分割线-->
//更改数据
//哈哈哈~~patch比较方便啊
//拼接要修改数据的id,和需要修该的属性和值
axios.patch('http://localhost:3000/list/1',{name:"老仙女"}).then(res => {
  console.log(res);
})

//put
//拼接要修改的数据的id和需要提供该对象的所有数据
axios.put('http://localhost:3000/list/1',{name:"老仙女",done:'false'}).then(res => {
  console.log(res);
})

----------------------等待更新的分割线,如有错误欢迎指正------------------------------------