1、接口返回数据格式

{
    "code":"200",
    "message":"",
    "data":{
        "total":1,
        "items":[
            {
                "id":2,
                "creator_name":"test",
                "category":"测试分类",
                "case_name":"测试list",
                "api_url":"http://baidu.com",
                "api_method":"POST",
                "description":"",
                "header_form":[
                    {
                        "enable":true,
                        "header_key":null,
                        "header_value":null
                    }
                ],
                "body_type":1,
                "body_value":null
            }
        ],
        "page":1,
        "count":10
    }
}

分 code data message

2、封装的axios

service.interceptors.response.use(
  (response) => {
    const { data, code } = response.data
    if (+code === 200) {
      // console.log('这是data')
      // console.log(data)
      return data
    } else {
      ElMessage.error(response.data.message)
      return Promise.reject(new Error(response.data.message))
    }
  },
  (error) => {
    console.log(error.response)
    error.response && ElMessage.error(error.response.data)
    return Promise.reject(new Error(error.response.data))
  }
)
export default service

如果code是200,就取出其中的data

3、正常情况取值,直接使用.value就行了,如果是Promise对象的话,使用.then()方法即可

  const category_list = ref([])
  const initCategoryList = async () =>{
    const res = await API.categoryList()
    category_list.value= res
  }
const table_data = ref([])
  const searchCaseList = () => {
    const res = API.searchCaseList(search.value)
    
    res.then(ress =>{
      table_data.value = ress.items
      console.log('ress.items')
      console.log(ress.items)
    } )
  }
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐