vue-cli 中 使用vue-resource 输出后台数据
阅读此文前,请了解vue-cli 组件如何使用 http://www.cnblogs.com/pearl07/p/6252116.html
1,mock(模拟)后台数据(新建data.Json文件)。
2,在build文件夹下的dev-server.js中,导入数据。
3,在main.js文件中引用vue-resource。
----在此之前,需要使用 npm install vue-resource 安装 vue-resource 依赖。
4,在app.vue中,在钩子函数内,利用vue-resource发送异步请求,成功后执行。
----在template中使用的<headcomp></headcomp>组件中,绑定(v-bind)获取的数据。
----v-bind:home=“home” 可以简写为 --- :home=“home”。
5,headcomp组件,在export default中,使用props接收绑定传过来的数据。
----于是便可以{{home.title}}进行调用,并渲染出。
6,最终效果
vue-cli 中 使用vue-resource 输出后台数据的更多相关文章
- vue cli 中关于vue.config.js中chainWebpack的配置
Vue CLI 的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...
- vue项目中使用mockjs+axios模拟后台数据返回
自己写练手项目的时候常常会遇到一个问题,没有后台接口,获取数据总是很麻烦,于是在网上找了下,发现一个挺好用的模拟后台接口数据的工具:mockjs.现在把自己在项目中使用的方法贴出来 先看下项目的目 ...
- 基于Vue开发的门户网站展示和后台数据管理系统
基于Vue的前端框架有很多,这几年随着前端技术的官方应用,总有是学不完的前端知识在等着我们,一个人的精力也是有限,不可能一一掌握,不过我们学习很大程度都会靠兴趣驱动,或者目标导向,最终是可以以点破面, ...
- Vue+Typescript中在Vue上挂载axios使用时报错
Vue+Typescript中在Vue上挂载axios使用时报错 在vue项目开发过程中,为了方便在各个组件中调用axios,我们通常会在入口文件将axios挂载到vue原型身上,如下: main.t ...
- Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试
在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...
- vue cli中的env详解
前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...
- [转]Vue CLI 3搭建vue+vuex 最全分析
原文地址:https://my.oschina.net/wangnian/blog/2051369 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@ ...
- Vue CLI 3搭建vue+vuex 最全分析
一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue ...
- Vue Cli 3:vue.config.js配置文件
Vue Cli 3生成的项目结构,没有build.config目录,而是使用vue.config.js来进行配置. vue.config.js 是一个可选的配置文件,如果项目的 (和 package. ...
随机推荐
- 浅析CSS中的haslayout
作为一名web开发人员,最大的希望不是自己的水平有多高,而是希望浏览器厂家能够统一标准,相信任何一个只要是接触过web程序开发的人员都有那样的感受,就是浏览器之间的兼容性问题总是让我们的工作平添诸多的 ...
- elastic search 学习笔记
Elastic search在数据分析的应用中相当于一个数据库的搜索引擎. 跟MySQL类似,它有自己的查询语言,只不过不是关系型数据库,属于NoSQL. 可以根据索引从分布式服务器文件系统中快速存取 ...
- directsound 应用实例
sdk里边有个文件夹Samples\C++\XInput\AudioController这个就是
- Linux下ln链接命令详解
ln是linux中又一个非常重要命令,它的功能是为某一个文件在另外一个位置建立一个不同的链接,这个命令最常用的参数是-s,具体用法是:ln –s 源文件 目标文件. 当我们需要在不同的目录,用到相同的 ...
- ComboBoxEdit
1. 如何使其不可编辑 TextEditStyle 设置为:DisableTextEditor 2. 如何设置鼠标为手形 Cursor 设置为:Hand
- jquery 判断页面滚动到底部
$(document).scrollTop() 获取垂直滚动的距离 即当前滚动的地方的窗口顶端到整个页面顶端的距离$(document).scrollLeft() 这是获取水平滚动条的距离获取顶端 只 ...
- YII 小部件 yii小部件查看方法 小物件做的表单
要使用小部件,可以先到总文件去找 framework/yiilite文件里面搜索“CAtiveForm” (如果觉得小部件的radio布局有点难看,可以在外面定义,具体可以在控制器里面定义) 如下 ...
- oracle常见为题汇总,以及一个简单数据连接操作工厂
本人软件环境:win8.1 64位操作系统,vs2013,安装好了与oracle数据库对应的客户端 连接oracle数据库.以及操作数据库 1.使用IIS建立网站,浏览网页时候,提示“ ...
- 删除svn文件
删除svn文件 sudo find . -name ".DS_Store" -exec rm -r {} \; sudo find . -name ".git" ...
- 关于ueditor1.4.3版复制section标签丢失class和style样式问题
在复制微信的文章格式到ueditor时发现section标签中的style和class属性丢失,严重影响美观. 原文格式,排版清晰段落分明赏心悦目: 复制到ueditor后的格式...这跟原文是没法比 ...