注意:本地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. python:面向对象初级

    面向对象编程类的概念 : 具有相同属性和技能的一类事物 人类 抽象对象 : 就是对一个类的具体的描述 具体的人 具体 使用面向对象的好处: 使得代码之间的角色关系更加明确 增强了代码的可扩展性 规范了 ...

  2. Python【每日一问】15

    问:简述with方法打开处理文件实际上做了哪些工作 答: filename= "test.txt" with open(filename, "w", encod ...

  3. jumpservice使用465端口发送邮件

    阿里云.华为云等云服务器默认屏蔽掉了25端口后,内网服务器如何通过跳板机发送邮件到外网邮箱. 如果是可联网的阿里云机器,可以直接配置mailx使用465端口发送邮件.需要进行ssl验证配置. Cent ...

  4. idea 优先引用项目代码,而非jar包

    1.现有项目,和jar包源码在同一层目录 2.idea直接打开ccccc,右键a,b两个文件中的pom.xml加入maven project,如下: 执行1,2 步骤,在b中引入a,刚引入a在最下方, ...

  5. python学习笔记之五

    1.Python HTTP server win环境需要加cgi参数 python -m http.server --cgi 8000 其他如下: python -m http.server 8080 ...

  6. linux ubuntu生成pac文件,实现代理

    sudo pip install genpac sudo pip install --upgrade genpac sudo genpac --proxy="SOCKS5 127.0.0.1 ...

  7. IE8图片上传预览

    $("#smallImg").attr('style', "filter:progid:DXImageTransform.Microsoft.AlphaImageLoad ...

  8. es6的理解

    目录:let——和var的区别const 特性:暂时性死区解构赋值 [] {}属性简洁函数简洁 属性表达式可以作为对象的属性名字符串扩展数组扩展对象扩展 Object.getPrototypeOf(实 ...

  9. vmware 进入虚拟机VMware的系统后鼠标不能点

    vmware 进入虚拟机VMware的系统后鼠标不能点 1)关闭虚拟机,重启win10,再打开虚拟机好了 2)

  10. MM-物料分类帐差异分摊

    物料分类帐差异分摊-MR21-MR22: https://wenku.baidu.com/view/6599e8f326fff705cc170ad8.html