vue通过axios请求本地json数据

1.下载插件

npm install axios --save

2.在main.js下引用axios

import axios from ‘axios‘

Vue.prototype.$http=axios

3.在static文件夹下写静态文件 home.json

{   "name":"xuexue",   "age":20}

4.在组件中请求数据

this.$http.get(‘../../static/home.json‘).then(function(res){  console.log(res)}.catch(err=>{console.log(err)}))

原文地址:https://www.cnblogs.com/zeng91/p/9775716.html

时间: 2024-11-06 07:48:56

vue通过axios请求本地json数据的相关文章

vue cli3.0用axios调用本地json数据一直报404

最近在基于vue做后台管理系统时,用了vue cli3.0用axios调用本地json数据一直报404,市面上所有的解决办法都没用,快崩溃了,结果最后发现原因是,vue cli3.0 public 文件夹才是静态资源文件,问题解决,记录一下,以后不再踩坑. 最近发现好多人都踩这个坑,索性把我的结构发出来. 参考地址:https://www.love85g.com/?p=1500 原文地址:https://www.cnblogs.com/dapengFly/p/11359456.html

Vue-cli3.0项目下axios请求本地json文件的数据

1. Vue-cli3.0项目节省了很多文件,比如讲vue-cli3.0之前版本的build/dev-server.js配置放在了vue.config.js中. 2. 在Vue-cli3.0项目的vue.config.js或vue-cli3.0之前版本的build/dev-server.js中配置: const express = require('express')const app = express() var singer = require('./src/db/data/singer.

vue组件+axios访问本地json

import axios from 'axios'export default { name: "AjaxText", data: function () { return { message: {} } }, mounted() { this.cartView(); }, methods:{ cartView() { let vm=this; axios.get("/static/sites.json", {}).then(function (response)

vue请求本地json数据

1.下载vue-resource插件 cnpm install vue-resource 1.2全局引入vue-resource: 在main.js import VueResource from 'vue-resource'; Vue.use(VueResource); 2.把静态josn文件放在项目根的 static文件夹: 3.发送请求: getNum() { this.$http.get("static/data/unusedorder.json").then(data =&g

android通过httpClient请求获取JSON数据并且解析

android通过httpClient请求获取JSON数据并且解析:http://www.cnblogs.com/gzggyy/archive/2013/05/08/3066288.html Android--使用Http向服务器发送请求并取得返回结果,下载图片:http://www.2cto.com/kf/201307/229489.html Android系列之网络(一)----使用HttpClient发送HTTP请求(通过get方法获取数据):http://blog.csdn.net/he

swift http请求返回json数据并解析

1 AppDelegate.swift // // AppDelegate.swift // QQDemo // // Created by 赵超 on 14-6-21. // Copyright (c) 2014年 赵超. All rights reserved. // import UIKit @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate { var window: UIWindow? fun

使用Sencha Touch加载本地Json数据

本例没有采用Sencha的mvc模式.只是一个简单的读取加载本地Json数据示例. 文档结构如下: app.js代码如下: Ext.require(['Ext.form.Panel', 'Ext.data.Store', 'Ext.data.reader.Json', 'Ext.dataview.DataView']); Ext.application({ name:'MyApp', icon:'images/icon.png', glossOnIcon:false, phoneStarupSc

魔术布局效果-使用本地JSON数据提供数据服务

在线演示 有社区朋友不知道如何修改外部OpenAPI为本地的JSON服务,这里做一个简单演示. 阅读原文:魔术布局效果-使用本地JSON数据提供数据服务 魔术布局效果-使用本地JSON数据提供数据服务

【Spring学习笔记-MVC-5】利用spring MVC框架,实现ajax异步请求以及json数据的返回

作者:ssslinppp      时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MVC与json参考文章:[spring学习笔记-mvc-3]返回json数据-方式1  和 [spring学习笔记-mvc-4]返回json数据-方式2. 使用到的技术主要如下: Ajax:使用JQuery 提供的ajax:==>需要引入jquery.min.js文件: Spring MVC: Jso