首先需要声明的是:本地请求,不用考虑跨域问题,这适用刚入坑的前端小白看,小白在做自己的项目时,通常都是用自己写的json数据,之后用axios请求过来,渲染到页面上。

1、cnpm install axios --save     (在终端安装 上axios,我是用的淘宝镜像安装的)

2、哪个组件使用axios方法请求数据,就在哪个组件里面引入,不用在main.js里面引入,不用改原型链

    在组件的script标签内写:    import  axios  from ‘axios’

3、在组件的methods配置项里使用axios

    methods:{

      fn(){

       axios.get('url').then(function(res){

          console.log(res.data)

        }).catch(function(err){

          console.log(err)

        })

      }  

    }

注意:在本地放置自己的json文件时,一定要放在项目的static文件夹下,因为static文件时,vue脚手架暴露在外面的静态文件,放在其他文件内用相对路径或绝对路径是访问不到的,这一点需要注意,踩了一下午坑,终于请求到本地的json数据了。

vue脚手架用axios请求本地数据的更多相关文章

  1. vue 在发送axios请求时数据渲染问题

    这是我请求的json格式的数据 一开始在vue用普通的数据渲染,更改为vue后使用v-for 发现没办法渲染上去了. obj.data就是以上数据. 必须加上这三行给this随意赋个值,神奇的事情就会 ...

  2. VUE请求本地数据的配置json-server

    VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...

  3. VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js

    VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...

  4. ajax和axios请求本地json数据对比

    AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进 ...

  5. vue使用axios请求后端数据

    1. 安装axios $ npm install axios 2.在main.js里面导入axios import axios from 'axios' Vue.prototype.$http = a ...

  6. vue模拟后台数据,请求本地数据的配置(旧版本dev-server.js,新版本webpack.dev.conf.js)

    最近学习一个vue-cli的项目,需要与后台进行数据交互,这里使用本地json数据来模仿后台数据交互流程.然而发现build文件夹下没有dev-server.js文件了,因为新版本的vue-webpa ...

  7. axios请求本地的json文件在打包部署到子目录域名下,路径找不到

    前言: 因为要同时部署两个项目,有一个是部署到域名下面的子目录下,如:https://xxx.com/siot-admin vue 项目中使用axios请求了本地项目的static文件夹下的json文 ...

  8. 解决axios请求本地的json文件在打包后路径出错问题

    vue 项目中使用axios请求了本地项目的static文件夹下的json文件,使用npm run build 打包后,在Hbuilder编辑器打开,页面报错404: 在浏览器打开的路径 http:/ ...

  9. vue使用axios请求本地json文件出现404

    之前的路径是这么写的,一直出现404,后来发现必须是http的才可以,这样是无法请求的 把路径改为以下   位置根据json文件决定,但是必须是http://localhost:断口号

随机推荐

  1. 能ping通外网的域名,浏览器不能上网的解决办法

    1,依次尝试了关闭防火墙,关闭杀毒软件,手动设置DNS都没有用. 2,最后通过这个cmd命令搞定,特此记录一下,重置初始化网络环境. netsh winsock reset 补充,上面的命令,重启电脑 ...

  2. Java知多少(103)网络编程之IP地址和InetAddress类

    Java语言的优势之一是Java程序能访问网络资源.Java提供一系列的类支持Java程序访问网络资源. TCP/IP协议和IP地址 为了进行网络通信,通信双方必须遵守通信协议.目前最广泛使用的是TC ...

  3. 短信文本查找之 MATCH 与 LIKE

    最近发现原生短信应用的搜索功能的搜索结果十分不准确,所以就开始追踪代码: 关于android searchview的使用这里就不描述了,简单说一下,android的searchVIew是支持autoc ...

  4. Wifi 开放系统认证和共享密钥身份认证

    记录开放系统认证和共享密钥认证的区别. 开放系统身份认证(open-systern authentication) 是802.11 要求必备的惟一方式. 由行动式工作站所发出的第一个帧被归类为auth ...

  5. Hibernate HQL的使用

    1.简单查询(查询所有) Session session=HibernateUtil.getSessionFactory().getCurrentSession(); Transaction tx=s ...

  6. IntellIJ IDEA 启动 参数 配置

    系统环境: 型号名称: MacBook Pro型号标识符: MacBookPro11,4处理器名称: Intel Core i7处理器速度: 2.8 GHz处理器数目: 1核总数: 4L2 缓存(每个 ...

  7. linux log

    adb shell logcat GOODIX:v *:s cat /proc/kmsg | grep "<<" ./cbootimg.sh adb shell get ...

  8. Unity3D UGUI Shader画一个圆环

    Shader "Unlit/NewUnlitShader" { Properties { _MainTex ("Texture", 2D) = "wh ...

  9. 【CF587D】Duff in Mafia 二分+前缀优化建图+2-SAT

    [CF587D]Duff in Mafia 题意:给你一张n个点m条边的无向图,边有颜色和边权.你要从中删去一些边,满足: 1.任意两条删掉的边没有公共的顶点.2.任意两条剩余的.颜色相同的边没有公共 ...

  10. H - Being a Good Boy in Spring Festival

    一年在外 父母时刻牵挂 春节回家 你能做几天好孩子吗 寒假里尝试做做下面的事情吧 陪妈妈逛一次菜场 悄悄给爸爸买个小礼物 主动地 强烈地 要求洗一次碗 某一天早起 给爸妈用心地做回早餐 如果愿意 你还 ...