vue.js及项目实战[笔记]— 03 vue.js插件

一. vue补充 1. 获取DOM元素救命稻草,document.querySelector 在template中标示元素`ref = "xxx" 在要获取的时候,this.$refs.xxx获取元素创建组件,装载DOM,用户点击按钮 ref 在DOM上获取的是原生DOM对象 ref在组件上获取的是组件对象 $el是拿其DOM 这个对象就相当于我们平时玩的this,也可以直接调用函数总结: $属性:$refs获取组件内的元素 $parent:获取当前组件对象的父组件 $child…

vue.js及项目实战[笔记]— 01 vue.js

一. vue基础 1. 历史介绍 angular 09年,年份较早,一开始大家是拒绝的 react 2013年,用户体验较好,直接拉到一堆粉丝 vue 2014年,用户体验较好前端框架与库的区别 jquery库->DOM(操作DOM)+请求 art-template 库->模板引擎框架 = 全方位功能齐全简易的DOM体验+发请求+模板引擎+路由功能 KFC的世界里,库就是一个小套餐,框架就是全家桶代码上的不同一般使用库的代码,是调用某个函数,我们自己把控库的代码一般使用框架,其框架…

vue.js及项目实战[笔记]— 02 vue.js基础

一. 基础 1. 注册全局组件应用场景:多出使用的公共性能组件,就可以注册成全局组件,减少冗余代码全局APIVue.component('组件名','组件对象') 2.附加功能:过滤器&监视改动 filter || filters 全局过滤器(给数据添油加醋显示):Vue.filter('过滤器名',过滤器方式fn) 组件内过滤器filters:{'过滤器名',过滤器方式fn} 将数据进行添油加醋的操作过滤器分为两种 1.组件内的过滤器(组件内有效) 2.全局过滤器(所有组件共享) 先注册…

vue.js及项目实战[笔记]— 05 WebPack

一. 历史介绍 1. 规范 AMD Commonjs||CMD UMD 参考:认识AMD.CMD.UMD.CommonJS 2. 工具 npm bower webpack browserify 参考:bower 和 npm 的区别详细介绍npm.cnpm.bower安装区别gulp/grunt和browserify/webpack的区别二. webpack打包模块源码 1. 把所有模块的代码放入到函数中,用一个数组保存起来 2. 根据require时传入的数组索引,能知道需要那一段代码 3.…

vue.js及项目实战[笔记]— 04 axios

一. axios 1. 基本使用 axios.method('url',[,...data],options) .then(function(res){ }) .catch(function(err){ }) 2. 合并请求 this.$axios.all([请求1,请求2]) .then(this.$axios.spread(function(res1,res2){ }) ) 3. 取消请求 API 3步骤: const cancelToken = axios.CancelToken; //…

Unity3D项目实战笔记（10）：Unity3D编译IPA的PostEvents–节约时间利器

最近,SDK支付等接入差不多了,就从Unity3D生成IPA (企业版License), 然,需要手动执行的PostEvents竟然多大10项+, 这些我默默的承受了1周时间,每次约浪费20分钟-额外的. 周末用了2天时间,研究一下官方的例子和雨松的相关博客2篇,总算是搞定了这件事情,开心! 痛苦的前传: Unity3D导出为XCode工程后,有如下任务需要做 Plist 文件中 <key>CFBundleDevelopmentRegion</key> 中文 <string&…

Unity3D项目实战笔记（5）：延时功能的几种实现

我所做过的系统,分单机版系统(2005年).CS系统(2010年).实时系统(2015年),各个系统均有“延时”功能:定时调度的: 本博客说的是实时系统中的延时功能(基于Unity3D游戏引擎). 在Unity3D中,新建的脚本会默认继承MonoBehaviour,其中Update函数会被引擎自动调度,如在我的电脑上,Update函数被调用的周期为0.012s. 那么Unity3D中,仅有通过Update函数来实现延时功能吗? 还有无其他的实现呢? 怎么才能让一个界面只显示1秒之后然后再执行…

Spring Boot +Vue 项目实战笔记（一）：使用 CLI 搭建 Vue.js 项目

前言从这篇文章开始,就进入真正的实践了. 在前端项目开发中,我们可以根据实际情况不同程度地使用 Vue.利用 Vue CLI(或写成 vue-cli,即 Vue 脚手架)搭建出来的项目,是最能体现 Vue 的特性的.这点在接下来的内容中我们可以慢慢感受. 关于项目的构建其实类似的文章网上有很多,但我还是重新写了一下,一是为了确保项目能够运行成功,二是对几个细节作了解释,三是加入了使用 IDE 的构建方法. 在动手操作之前,我希望大家已经清楚什么是 "前后端分离" ,什么是 "…

vue.js+koa2项目实战（一）创建项目和elementUI配置

前端采用vuex+element-ui: 后端采用koa2+restfulAPI+sequlize: (一)项目介绍宠物社区 1.社区 2.好友 3.说说 4.宠粮 5.健康 (二)项目框架 1.Vue.js 2.Vuex 框架 3.Element UI 4.Axios 交互 5.Koa2 + es6 6.Restful API 7.Sequlize 8.mysql (三)创建项目和elementUI配置 vue init webpack pet elementui 1.安装: npm ins…

Spring Boot +Vue 项目实战笔记（二）：前后端结合测试（登录页面开发）

前言:关于开发环境每位 Coder 都有自己偏好的开发工具,从大的方面划分主要有文本编辑器流和 IDE 流两种,我有一段时间也喜欢用编辑器(Sublime Text.Vim),但对我来说开发效率确实不如使用 IDE 高,所以就放弃了.不过需要修改某一代码片段时,使用编辑器还是比较便捷的. 虽说大家可以按照自己的情况任意选择工具,但做教程只能顾及其中一种,所以不好意思了读者大人们. 我比较习惯用 IntelliJ IDEA,在 Java 后端方面地位没得说,然而我前端也是用它做的...说实话没感…

【慕课网实战】Spark Streaming实时流处理项目实战笔记二十一之铭文升级版

铭文一级: DataV功能说明1)点击量分省排名/运营商访问占比 Spark SQL项目实战课程: 通过IP就能解析到省份.城市.运营商 2)浏览器访问占比/操作系统占比 Hadoop项目:userAgent DataV访问的数据库(MySQL),需要能够在公网上访问 DataV测试数据CREATE TABLE course_click_count(ID int(4) PRIMARY KEY,day VARCHAR(10),course_id VARCHAR(10),click_count lo…

【慕课网实战】Spark Streaming实时流处理项目实战笔记十五之铭文升级版

铭文一级:[木有笔记] 铭文二级: 第12章 Spark Streaming项目实战行为日志分析: 1.访问量的统计 2.网站黏性 3.推荐 Python实时产生数据访问URL->IP信息->referer和状态码->日志访问时间->写入到文件中本地与虚拟机都要装了python才能运行重要代码: #coding=UTF-8 #数组最后一个没有“,” url_paths = [ "class/128.html", "class/112.html&…

【慕课网实战】Spark Streaming实时流处理项目实战笔记十四之铭文升级版

铭文一级: 第11章 Spark Streaming整合Flume&Kafka打造通用流处理基础 streaming.conf agent1.sources=avro-sourceagent1.channels=logger-channelagent1.sinks=log-sink #define sourceagent1.sources.avro-source.type=avroagent1.sources.avro-source.bind=0.0.0.0agent1.sources.avro…

【慕课网实战】Spark Streaming实时流处理项目实战笔记二之铭文升级版

铭文一级: 第二章:初识实时流处理需求:统计主站每个(指定)课程访问的客户端.地域信息分布地域:ip转换 Spark SQL项目实战客户端:useragent获取 Hadoop基础课程 ==> 如上两个操作:采用离线(Spark/MapReduce)的方式进行统计实现步骤: 课程编号.ip信息.useragent 进行相应的统计分析操作:MapReduce/Spark 项目架构日志收集:Flume 离线分析:MapReduce/Spark 统计结果图形化展示问题小时级别 10分钟…

vue.js的项目实战

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由蔡述雄发表于云+社区专栏需求背景组件库是做UI和前端日常需求中经常用到的,把一个按钮,导航,列表之类的元素封装起来,方便日常使用,调用方法只需直接写上或者这样的代码就可以,是不是很方便呢,接下来我们将要完成以下页面: 这是我们组件库的首页,包含三个子页面,按钮页面.列表页面.导航页面:点击进去子页面会由路由来配置.先看我们的目录结构: pages目录存放我们的页面,包括首页和三个子页面:components目录存放我们的具体组…

vue项目常见需求（项目实战笔记）

一.起步 1.引入reset.css解决手机之间不同分辨率的问题(reset.css为别人封装的css文件) import './assets/styles/reset.css' 使用方式 1rem=50px 我们使用rem代替px 2.引入border.css解决手机边框1px的问题 import 'styles/border.css' 使用方式 class="top" //在添加上边框,同理 left.right.bottom 3.解决移动端点击事件存在300毫秒延迟问题在项目目…

vue.js+koa2项目实战（四）搭建koa2服务端

搭建koa2服务端安装两个版本的koa 一.版本安装 1.安装 koa1 npm install koa -g 注:必须安装到全局 2.安装 koa2 npm install koa@2 -g 二.创建项目 1.安装 koa 生成器 (koa1 和 koa2 都用此生成器) npm install koa-generator -g 2. koa1 生成一个 test 项目,切到 test 目录并下载依赖 koa test cd test npm install 运行:npm start 访问:…

Spring Boot +Vue 项目实战笔记(三）：数据库的引入

这一篇的主要内容是引入数据库并实现通过数据库验证用户名与密码. 一.引入数据库之前说过数据库的采用是 MySQL,算是比较主流的选择,从性能和体量等方面都比较优秀,当然也有一些弊端,但数据库不是我们这里讨论的重点,暂时能用就行. 1.安装数据库我的 MySQL 版本是 5.7,官方下载页面是https://dev.mysql.com/downloads/mysql/5.7.html#downloads 安装教程我随便搜了一篇,可以参考https://blog.csdn.net/ma52465…

vue.js学习与实战笔记（1）

公司需要开发一个小型官网,个人决定放弃angular2,使用vue来进行开发,由于是培训出生,思想一时难以转变,所以只能从零开始,下面奉上学习笔记 vue.js主要参考官网进行学习与开发由于vue不支持ie8以下的游览器,所以需要向下兼容的可以洗洗睡了安装:由于是学习,所以直接在官网下载了开发版的js包学习: 1.声明式渲染在div里就会输出Hello Vue 条件与循环…

vue.js+koa2项目实战（五）axios 及 vue2.0 子组件和父组件之间的传值

axios 用法: 1.安装 npm install axios --save-dev 2.导入 import axios from 'axios'; 3.使用 axios.post(url,params) .then(function(res){ console.log(res); alert(res.data); }) .catch(function(err){ console.log(err); }) 4. vue2.0 子组件和父组件之间的传值 Vue是一个轻量级的渐进式框架,对于它的一…

vue.js+koa2项目实战（三）登录注册模态框

登录注册模态框注: [Vue warn]: Do not use built-in or reserved HTML elements as component id: diaLog 原因:diaLog 组件名与 HTML元素名称重复,将组件名改为 diaLoger 即可. 1.封装可复用 DiaLog 组件 DiaLog.vue <template> <el-dialog title="提示" :visible.sync="dialogVisi…

vue.js+koa2项目实战（二）创建 HeadBar 组件

elementUI界面布局 1.创建 HeadBar 组件 HeadBar.vue <template> <el-row> <el-col :span="2"> </el-col> <el-col :span="4" style='background:#f9fafc;font-size:2em;'><i class="el-icon-menu"></i>宠物空间…

vue.js学习与实战笔记（2）

驼峰式写法时需要注意的问题学习到组件这一章时,由于没注意到vue中对于camelCased的解释,导致出错了都找不出来,后面发现在使用驼峰式写法时,在使用模板的时候需要使用kebab-case命名附图:…

vue.js+koa2项目实战（六）数据库建表

数据库建表 1.打开 MySQL 终端 2.查看所有数据库 show databases 3.创建数据库 create database pet 4.进入数据库 use pet 5.创建数据表 create table users( id bigint not null auto_increment primary key, email varchar(60) not null, pwd varchar(60) not null, nicheng varchar(60) not null, up…