注意:本地json文件必须放在static目录下面,读取或交互数据前,请先安装vue-resource。点击前往  -->vue-resource中文文档)

一、Vue读取本地JSON数据

  created() {
this.$http.get("/static/data.json").then(
response => {
this.data = response.data;
},
response => {
console.log(response);
}
);
},

二、Vue与后台数据交互

      this.$http.get("url").then(
response => {
this.data = response.data;
},
response => {
console.log("获取失败!");
}
);

  

Vue数据交互的更多相关文章

  1. 11.vue 数据交互

    vue new Vue({ el,选择器 string/obj 不能选择html/body data, methods, template string/obj //生命周期 -- 虚拟DOM 1.初 ...

  2. webpack+vue项目实战(四,前端与后端的数据交互和前端展示数据)

    地址:https://segmentfault.com/a/1190000010063757 1.前言 今天要做的,就是在上一篇文章的基础上,进行功能页面的开发.简单点说呢,就是与后端的数据交互和怎么 ...

  3. vue前后台数据交互vue-resource文档

    地址:https://segmentfault.com/a/1190000007087934 Vue可以构建一个完全不依赖后端服务的应用,同时也可以与服务端进行数据交互来同步界面的动态更新. Vue通 ...

  4. vue中的数据监听以及数据交互

    现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...

  5. 常用vue请求交互数据方式

    几种 vue的数据交互形式 var that=this get请求 that.$http.get("1.txt").then(function(result){ console.l ...

  6. Vue中独立组件之间数据交互

    独立组件之间数据交互:通过自定义事件 组件A中的[数据],传递给组件B 1.创建组件A,组件B 2.组件B在实例创建完成时就开始监听事件[等待接收数据]:钩子 3.组件A中触发事件,发送数据 注意:接 ...

  7. Vue框架(二)——Vue指令(v-once指令、v-cloak指令、条件指令、v-pre指令、循环指令)、todolist案例、Vue实例(计算、监听)、组件、组件数据交互

    Vue指令 1.v-once指令  单独使用,限制的标签内容一旦赋值,便不可被动更改(如果是输入框,可以主动修改) <!DOCTYPE html> <html lang=" ...

  8. vue,一路走来(3)--数据交互vue-resource

    所有的静态页面布局完成后,最重要的就是数据交互了,简单来说,vue-resource就像jquery里的$.ajax,用来和后台交互数据的.放在created或ready里运行来获取或者更新数据的.不 ...

  9. vue 前后端数据交互问题解决

    先在vue项目中配置好路由组件路由 然后写相应组件 2 后端 写接口赔路由 第三  解决跨域问题 处理数据交互 这样前端就拿到了数据

随机推荐

  1. windows旋转屏幕快捷键配置

    1.打开屏幕分辨率 2.高级设置 3.英特尔核心显卡控制板 4.图形属性 5.选项和支持 6.管理快捷键(启用.禁用)

  2. 【docker】服务随容器启动而自启动

    场景: 有一个docker, 在该docker中有服务A,希望每次启动容器时服务A都随着容器启动.这样就不用每次都进入容器手动启动服务了. 方法: 1.需要在docker中添加一个启动服务脚本auto ...

  3. yum搭建 Lamp环境

    yum搭建Lamp yum install -y httpd yum install -y nano rpm 安装 Php7 相应的 yum源 rpm -Uvh https://dl.fedorapr ...

  4. Intellij IDEA超好用的快捷键

    1.首推 Ctrl+Shift+Enter,自动跳出括号,在行尾添加分号,并自动回车. 2.Ctrl+Shift+J,将多行代码折叠成一行. 当你遇到的时候,这个快捷键非常实用.比如你在写painle ...

  5. 理解block和inode

    什么是block和inode? 定义:block就像是杯子 inode就像是杯子的编号,因为杯子太多了 1.根据文件的大小,在磁盘中储存时会占用一个或多个block:那么究竟多大的文件会使用一个blo ...

  6. 通过google cloud API 使用 WaveNet

    Cloud Text-to-Speech 中使用了WaveNet,用于TTS,页面上有Demo.目前是BETA版 使用方法 注册及认证参考:Quickstart: Text-to-Speech 安装g ...

  7. mysql免解压版安装教程步骤

    首先我这里演示的是mysql-5.6.27-winx64这个免解压的版本 添加环境变量(如添加了则跳过该步骤) 操作如下: )右键单击我的电脑->属性->高级系统设置(高级)->环境 ...

  8. 取消win10 任务栏已固定的软件

    通过组策略编辑器 设置为“已禁用”,就可 ,自由取消已固定的图标.

  9. VMware12 安装 Mac OS 10.12 步骤及设置优化教程

    最近公司要开发苹果的ARKit应用,但是项目组穷啊,只有美工用着一台苹果本本,所以肯定不能老用他的电脑,效率低还老打扰他.所以我就想着用虚拟机整,毕竟玩了N年的虚拟机了,应该是没啥问题的.所以就开始各 ...

  10. centos设置路由route

    一. route命令                        1) 查看:route -n      2)添加: route add  [-net|-host]  target [netmask ...