vue模拟数据使用

1、在vue views同级新建util文件夹，在util新建data-api.js （util/data-api.js ）

export let http = {
  get: function(url, config = {}) {
    return loadData(url);
  },
  post: function(url, data, config = {}) {
    return loadData(url);
  }
};
async function loadData(file) {
  return { data: (await import("../data" + file + ".json")).default };
}

export function request(url, cb) {
  http
    .get(url)
    .then(res => res.data)
    .then(cb);
}

2、在vue views同级新建data文件夹，在data新建num.json （data/num.json）

{
  "data":{
    "name":"tom",
    "age":23
  }
}

3.页面中使用

<template>
    <div>
        <h3>vue技术点学习</h3>
    </div>
</template>
<script>
import {request} from "../util/api.js"
export default {
    data(){
        return{

        }
    },
    mounted(){
        request("/num",res=>{
            console.log(res)
        })
    }
}
</script>
<style lang="sass">

</style>