vue脚手架用axios请求本地数据
首先需要声明的是:本地请求,不用考虑跨域问题,这适用刚入坑的前端小白看,小白在做自己的项目时,通常都是用自己写的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请求本地数据的更多相关文章
- vue 在发送axios请求时数据渲染问题
这是我请求的json格式的数据 一开始在vue用普通的数据渲染,更改为vue后使用v-for 发现没办法渲染上去了. obj.data就是以上数据. 必须加上这三行给this随意赋个值,神奇的事情就会 ...
- VUE请求本地数据的配置json-server
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- ajax和axios请求本地json数据对比
AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进 ...
- vue使用axios请求后端数据
1. 安装axios $ npm install axios 2.在main.js里面导入axios import axios from 'axios' Vue.prototype.$http = a ...
- vue模拟后台数据,请求本地数据的配置(旧版本dev-server.js,新版本webpack.dev.conf.js)
最近学习一个vue-cli的项目,需要与后台进行数据交互,这里使用本地json数据来模仿后台数据交互流程.然而发现build文件夹下没有dev-server.js文件了,因为新版本的vue-webpa ...
- axios请求本地的json文件在打包部署到子目录域名下,路径找不到
前言: 因为要同时部署两个项目,有一个是部署到域名下面的子目录下,如:https://xxx.com/siot-admin vue 项目中使用axios请求了本地项目的static文件夹下的json文 ...
- 解决axios请求本地的json文件在打包后路径出错问题
vue 项目中使用axios请求了本地项目的static文件夹下的json文件,使用npm run build 打包后,在Hbuilder编辑器打开,页面报错404: 在浏览器打开的路径 http:/ ...
- vue使用axios请求本地json文件出现404
之前的路径是这么写的,一直出现404,后来发现必须是http的才可以,这样是无法请求的 把路径改为以下 位置根据json文件决定,但是必须是http://localhost:断口号
随机推荐
- 【WPF】ListBox GridViewColumn Header 文字换行、文字多行显示
ListBox GridViewColumn Header 文字换行.文字多行显示,在Header中需要换行的地方写 <GridViewColumn Header="空间另存 为总量& ...
- <我的股票交易知识汇总与个人感悟_v1.0 (By geman)>
书在这里 一个完整的股票交易包括选股.买股.持股.卖股四个阶段. 右侧交易,顶是跌出来的,底是涨出来的 一定要敢于止损,设好止损位,严格执行,即使踏空也无怨无悔:资金安全第一位 坚持只买处于上升通道的 ...
- Halcon的数据类型
两大类: 1.图形参数Iconic (image, region, XLD) 2.与控制参数Control (string, integer, real, handle), 在Halcon算子的参数中 ...
- C++ 智能指针六
/* 智能指针unique_ptr */ #include <iostream> #include <string> #include <memory> #incl ...
- python中的生成器函数是如何工作的?
以下内容基于python3.4 1. python中的普通函数是怎么运行的? 当一个python函数在执行时,它会在相应的python栈帧上运行,栈帧表示程序运行时函数调用栈中的某一帧.想要获得某个函 ...
- Java如何从IP地址查找主机名?
在Java编程中,如何从IP地址查询出主机名? 以下示例显示了如何通过net.InetAddress类的InetAddress.getByName()方法将指定的IP地址查到主机名称. package ...
- 【代码审计】YzmCMS_PHP_v3.6 CSRF漏洞分析
0x00 环境准备 YzmCMS官网:http://www.yzmcms.com/ 程序源码下载:http://pan.baidu.com/s/1pKA4u99 测试网站首页: 0x01 代码分析 ...
- lua_tinker源码笔记1
本篇仅简单介绍使用lua_tinker让lua调用C++函数的过程, C++调用lua函数可以参见博客Lua脚本和C++交互(一). 未完待续. (一) lua调用C++全局函数 这里以lua_tin ...
- [APUE]进程控制(下)
一.更改用户ID和组ID 可以用setuid设置实际用户ID和有效用户ID.可以用setgid函数设置实际组ID和有效组ID. #include <sys/types.h> #includ ...
- 解决UEFI启动模式下无法使用U盘启动WIN7安装界面
问题场景 现在很多人都习惯使用U盘进行安装系统,主要是快捷方便.本文主要是讲解一下U盘在UEFI模式下无法启动Windows7安装界面的问题,可能很多人会说使用PE系统进行安装,但是因为我的主板只有独 ...