前端 开发笔记Vue

vue-router

导航栏 隐藏/显示

router下的 js文件中：

引入的组件component后面添加：meta: { navShow: false }

App.vue 文件中：

导航外部标签上添加：v-show=”$route.meta.navShow”

axios

在main.js 配置

import axios from 'axios'
Vue.prototype.$axios = axios

增删改查

// 获取 列表 数据
getList(){
  axios.get(‘http://localhost:3000/list’)
    .then(res => {
      this.list = res
    })
    .catch(err => {
      conosle.log(err)
    })
}


// 搜索
this.$axios.get(“http://localhost:3000/list”, {
  params: {
    id: this.id
  }
})
  .then(res => {
    if (res.status == 200) {
      this.id = res.id
    }
  })
  .catch(err => {
    conosle.log(err)
  })


// 添加
this.$axios.post(“http://localhost:3000/list”, {
  id: this.id,
  date: new Date()
})
  .then(res => {     
    if(res.status == 200){        
      conosle.log(res)        
      this.getList() // 重新渲染列表      
    }
  })  
  .catch(err => {     
    conosle.log(err)  
  })


// 删除
this.$axios.delete(`http://localhost:3000/list/${thisId}`)  
  .then(res => {     
    console.log(res)  
  })  
  .catch(err => {     
    conosle.log(err)  
  })