说明:本人也是刚接触VUE.js,作为一个学习笔记,旨在与初学者共同学习。其中编程语法错误或者写作水平刺眼,还望轻喷。

使用工具:Visual Studio Code。技术栈为vue2+vuex+axios+vue-router+mintUI

备注:Vue.js开发环境的搭建,参见window下搭建Vue.Js开发环境

一,构建项目脚手架

在我的工作区下输入vue init webpack Lottery,会自动构建项目脚手架

进入项目Lottery中输入cnpm install进行库安装

此外,本项目还需单独引入

cnpm i mint-ui --save

cnpm i axios --save

cnpm i vuex --save

/config/index.js中找到proxyTable加入。代理一个“数据”的接口,我们取彩票数据从这个第三方接口获取。♣此代理解决跨域只能在开发环境有效

 '/myapi': {
target: 'http://f.apiplus.net/',
changeOrigin: true,
pathRewrite: {
'^/myapi': ''
}
}

运行npm run dev,项目可以跑起来

Vuejs2.0构建一个彩票查询WebAPP(1)

Vuejs2.0构建一个彩票查询WebAPP(2)

Vuejs2.0构建一个彩票查询WebAPP(3)

Vuejs2.0构建一个彩票查询WebAPP(1)的更多相关文章

  1. Vuejs2.0构建一个彩票查询WebAPP(2)

    一,Vuex的使用 import Vue from 'vue' import Vuex from 'vuex' import MsgModules from './MsgModules' Vue.us ...

  2. Vuejs2.0构建一个彩票查询WebAPP(3)

    整个工程的目录及截图如下,源码下载    使用心得: 1.了解Vue的生命周期很有必要,详情参见博文Vue2.0 探索之路——生命周期和钩子函数的一些理解 2.Vuex全局状态管理真是美味不可言 st ...

  3. 开源低代码平台开发实践二:从 0 构建一个基于 ER 图的低代码后端

    前后端分离了! 第一次知道这个事情的时候,内心是困惑的. 前端都出去搞 SPA,SEO 们同意吗? 后来,SSR 来了. 他说:"SEO 们同意了!" 任何人的反对,都没用了,时代 ...

  4. vue2.0构建淘票票webapp

    项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...

  5. vuejs2.0实现一个简单的分页

    用js实现的分页结果如图所示: css .page-bar{ margin:40px; } ul,li{ margin: 0px; padding: 0px; } li{ list-style: no ...

  6. Blazor入门笔记(1)-从0构建一个组件

    1.环境 VS2019 16.5.1 .NET Core SDK 3.1.200 Blazor WebAssembly Templates 3.2.0-preview2.20160.5 2.创建项目 ...

  7. react构建淘票票webapp,及react与vue的简单比较。

    前言 前段时间使用vue2.0构建了淘票票页面,并写了一篇相关文章vue2.0构建淘票票webapp,得到了很多童鞋的支持,因此这些天又使用react重构了下这个项目,目的无他,只为了学习和共同进步! ...

  8. 使用TensorFlow v2.0构建多层感知器

    使用TensorFlow v2.0构建一个两层隐藏层完全连接的神经网络(多层感知器). 这个例子使用低级方法来更好地理解构建神经网络和训练过程背后的所有机制. 神经网络概述 MNIST 数据集概述 此 ...

  9. 使用vuejs2.0和element-ui 搭建的一个后台管理界面

    说明: 这是一个用vuejs2.0和element-ui搭建的后台管理界面. 相关技术: vuejs2.0:一套构建用户界面的渐进式JavaScript框架,易用.灵活.高效. element-ui: ...

随机推荐

  1. Struts2学习(三)上传下载

    今天记录一下利用struts2实现上传下载,借此案例说明一下struts2的开发流程. 须要注意的是struts2版本号不同非常多地方的写法是不同的.本例使用struts2.3.15 .有差别的地方文 ...

  2. bzoj1497【NOI2006】最大获利

    1497: [NOI2006]最大获利 Time Limit: 5 Sec  Memory Limit: 64 MB Submit: 3437  Solved: 1674 [id=1497" ...

  3. hdu2236

    链接:点击打开链接 题意:在一个n*n的矩阵中,找n个数使得这n个数都在不同的行和列里而且要求这n个数中的最大值和最小值的差值最小 代码: #include <iostream> #inc ...

  4. bzoj1001: [BeiJing2006]狼抓兔子(初识是你最小割)

    1001: [BeiJing2006]狼抓兔子 题目:传送门 题解: 听说这题当初是大难题...可惜当年没有网络流hahahha 现在用网络流的思想就很容易解决了嘛 给什么连什么,注意是双向边,然后跑 ...

  5. PostgreSQL Replication之第一章 理解复制概念(2)

    1.2不同类型的复制 现在,您已经完全地理解了物理和理论的局限性,可以开始学习不同类型的复制了. 1.2.1 同步和异步复制 我们可以做的第一个区分是同步复制和异步复制的区别. 这是什么意思呢?假设我 ...

  6. mysql优化篇之表分区

             当表的数据量达到一定数量时(如单个.myd文件都达到10G,myd 是mysql的数据文件),这时候读取起来必然效率很低.          1.从业务角度可以解决(分表)      ...

  7. BZOJ 2724 [Violet 6]蒲公英(分块)

    题意 在线区间众数 思路 预处理出 f[i][j] 即从第 i 块到第 j 块的答案.对于每个询问,中间的整块直接用预处理出的,两端的 sqrtn 级别的数暴力做,用二分查找它们出现的次数.每次询问的 ...

  8. opencv——均值/中值滤波器去噪

    实验内容及实验原理: 1.用均值滤波器(即邻域平均法)去除图像中的噪声: 2.用中值滤波器去除图像中的噪声 3.比较两种方法的处理结果 实验步骤: 用原始图像lena.bmp或cameraman.bm ...

  9. YOLOv3学习笔记

    Darknet/Yolo官网:https://pjreddie.com/darknet/yolo/ GitHub程序:https://github.com/AlexeyAB/darknet 关于程序程 ...

  10. Unity 调用 Android Native 方法(一) 获得Android系统音量

    学习雷锋,好榜样,接下来的这一系类教程里,将通过unity来实现Android端的一些常用功能, 不需要在 Asset/Plugins/Android 目录下引用jar包或者aar包,这是重点. us ...