自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 vue watch的用法

vue watch的三种用法 var app = new Vue({ data: { a: 1, b: 2, c: 3 }, watch: { // watch的第一种形式 a: function (val, oldVal) { // 在监听$...

2019-03-22 16:41:36

阅读数 325

评论数 0

原创 vue源码学习一

本篇主要为阅读源码做一些准备,相关代码参考了网上相关资料。 本篇主要讲述数据的动态动态绑定与更新: 1:数据的动态绑定与更新核心方法是Object.defineProperty(),下面是相关介绍。 Object.definePropety(obj,property,descripto...

2019-02-27 18:34:16

阅读数 25

评论数 0

原创 递归组件的用法

先看效果图: 1:先mock数据 //list.js var list = { list: [{ title: '成人票', children: [{ title: '成人三馆联票' ...

2019-02-26 15:37:37

阅读数 138

评论数 0

原创 slot插槽

代码模板如下: <div id="app"> <h1>插槽slot</h1> <h1>具名插槽</h1&g...

2019-02-26 11:25:46

阅读数 22

评论数 0

原创 v-model的使用

组件中v-model的使用: v2.2以前的版本是这样应用的, <body> <div id="app"> <h1>组件中v-model的使用</h1...

2019-02-25 18:35:20

阅读数 424

评论数 0

原创 vue祖孙组件之间的数据传递

**解决的问题:**  使用$attrs和$listeners实现祖孙组件之间的数据传递,也就是多重嵌套组件之间的数据传递。 **注意:** 本方法针对vue2.4版本及以上,使用$attrs和$listeners来实现的 **解决方案:** **首先创建父组件:**      父组件用...

2019-02-25 18:08:04

阅读数 2286

评论数 1

原创 git命令

git remote add //本地仓库关联远程仓库 name :定义一个远程仓库的名称 url:远程仓库的地址。 eg: git remote add yx https://github.com/schacon/ticgit git remote -v //显示所有远程仓库的...

2019-02-22 15:01:29

阅读数 30

评论数 0

原创 本地仓库如何与远程仓库交互

远程分支与本地分支的交互 1:当执行完git clone克隆完某个远程仓库后,本地的仓库状态如下图: origin/master: 你克隆的时间点远程仓库master分支的指向。 master:git自动为你创建master分支,并确定初始指向与远程仓库master分支是一样的。 2:接着其他人...

2019-02-22 11:23:39

阅读数 122

评论数 0

原创 webpack3构建简单的多页面应用

解决的问题 1:多页面结构如何设置,2:公共样式如何配置,3:入口文件都需要导入哪些样式 ,4:如何自动配置入口文件而不需要手动书写。 首先看下项目目录 该项目有两个页面,分别位于index和login文件夹下, common.css为公共样式 实现的主要功能: 1:通过AutoWebPlugi...

2019-02-20 18:57:46

阅读数 95

评论数 0

原创 webpack3构建简单的单页面应用

本文主要记载的是WebPlugin插件的用法 先看目录结构 下面为webpack.config.js的配置文件 const path = require('path'); const UglifyJsPlugin = require('webpack/lib/opt...

2019-02-20 17:40:24

阅读数 53

评论数 0

原创 promise简述

一:先看第一段代码: var p =new Promise(function(resolve,reject){ //说明传入的参数函数会立即执行。 console.log('create a promise'); resolve('success&...

2019-02-12 11:29:38

阅读数 67

评论数 0

转载 js对象遍历

首先创建一个可操作的对象: //首先在Object的prototype上添加属性,这样其他对象可以继承。 Object.prototype.userProp = 'userProp'; Object.prototype.getUserProp =function(){ ...

2019-01-29 14:44:32

阅读数 43

评论数 0

转载 js数组简述

一:Array.of() var a = Array.of(1,2); console.log(a) //a =[1,2] var b = Array.of(8.0) console.log(b) //b=[8] var c = Ar...

2019-01-26 16:36:40

阅读数 64

评论数 0

原创 正则表达式简单记录

一:创建正则有两种方式: !:var pattern = /box/ig                         //第二个参数可省略 !! :var pattern = new RegExp('box','ig')  //第二个参数可省略  ...

2019-01-26 09:42:49

阅读数 30

评论数 0

原创 vuex简单总结

最近要使用vuex,所以阅读了一下API做如下简要记载: state; 在根组件中添加store选项,这样它的所有子组件都注入了store, eg: var app = new Vue({     data:{     },     store, //根组件添加选项,子组件自动注入(inje...

2019-01-21 17:58:29

阅读数 22

评论数 0

原创 vue 报错: [Vue warn]: Computed property "checkall" was assigned to but it has no setter.

报错如图: 报错原因: computed:{ checkall:{ //购物车与checked数量一致时,全选为true get(){ return this.cartCheckedCount===this.items.length; }...

2019-01-19 18:00:36

阅读数 2869

评论数 0

原创 简单的canvas实例

效果图:   完整代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&...

2019-01-17 11:28:19

阅读数 169

评论数 0

原创 canvas总结

canvas 绘图 1:需要在div中做如下声明,注意宽高也要写于里面 <canvas id="drawingCanvas" width="500" height="300"></canv...

2019-01-16 11:24:13

阅读数 49

评论数 0

原创 2048小游戏分析

这两天写了个2048小游戏先看效果图:   现在分享一下它的逻辑: 首先要关注的就是它的页面结构: 容器中放置16个div用于,初始页背景的16个格子,注意class命名方式,这样命名可以用函数方便的进行布局,和其他功能操作。 <div class="c...

2019-01-12 11:42:48

阅读数 63

评论数 0

原创 简单抽奖系统的实现

先看效果图 点击抽奖,将会顺时针旋转。停留概率,转动速率可以控制。   我自己做的过程中遇到的小问题。 i: 顺时针旋转。 因为结构用的是li,顺时针旋转本质上是背景的变化,这里我定义了一个数组来处理顺时针旋转的问题。 var arr= [0,1,2,4,7,6,5,3]; ...

2019-01-10 11:54:25

阅读数 458

评论数 2

原创 打开网页右下角广告栏慢慢出现,点击慢慢消失

上半年会坚持每周写几个用纯js实现的功能。 篇一: 功能:打开网页div慢慢从右下角出现,点x慢慢消失。 效果图: js代码: window.onload=function(){ var tardiv = getElement('.content'); ...

2019-01-08 18:58:53

阅读数 184

评论数 0

原创 linux下安装node.js

说明:大部分的坑我应该踩完了吧。 一:首先执行: wget https://npm.taobao.org/mirrors/node/v10.15.0/node-v10.15.0-linux-x64.tar.xz 这一步就是将node.js下载到linux系统下 1: 可能没有wget命令 ...

2019-01-07 19:52:09

阅读数 22

评论数 0

原创 编程式路由

编程式路由就是通过js来跳转组件 现在实现通过goods组件向购物组件的跳转,他们都挂载于app.vue上 第一步: app.vue 添加挂载 <router-view></router-view> 第二步:...

2019-01-06 15:00:09

阅读数 127

评论数 1

原创 嵌套路由

嵌套路由使用场景: 左侧为菜单,右侧为内容,当点击菜单时,切换内容组件而整个页面却不刷新. 嵌套路由的知识点大致和动态路由一样,不同点如下: eg: good组件中嵌套title组件和content组件 router/index.js中的配置。 import goods from './...

2019-01-06 14:23:33

阅读数 25

评论数 0

原创 动态路由

何为动态路由: 动态路由就是带参数的路径,也就是不固定的路径 eg: localhost:8080/user/123, 其中123就是参数 动态路由用到的知识点 1:<router-view>&am...

2019-01-05 22:51:04

阅读数 607

评论数 0

原创 vue父子组件间通信

父组件向子组件通信 原理: 父组件data中存在一属性,子组件通过props接收,父组件动态绑定该数据。 子组件代码: <template> <div class="child"&...

2019-01-05 20:48:09

阅读数 44

评论数 0

转载 nodejs fs模块

本文转载自 https://www.cnblogs.com/starof/p/5038300.html nodejs模块——fs模块 fs模块用于对系统文件及目录进行读写操作。 一、同步和异步 使用require('fs')载入fs模块,模块中所有方法都有同步和异步两种...

2019-01-03 15:36:22

阅读数 759

评论数 0

原创 css3 -preserve-3d案例

代码: html <div class="flipper"> <span class="flipper-object flipper-vertical"> <spa...

2018-12-27 10:21:39

阅读数 352

评论数 0

原创 jquery EasyUi的使用

一:首先需要导入一下文件: <link href="../jquery-plug/themes/default/easyui.css" rel="stylesheet" type="text/css" /> ...

2018-12-25 10:13:35

阅读数 29

评论数 0

原创 css3 三角

  如图这是带border的三角,代码如下 .menu_two::after{content: ''; box-shadow: 1px 1px #ddd; height: 1rem; left: 1rem; top: -.5rem; -webkit-transform...

2018-12-18 16:46:43

阅读数 22

评论数 0

原创 css3--media查询

今天使用media查询发现不起作用,代码如下: nav li a { text-decoration: none; font-size: 1.2em;}; @media only screen and (min-width:480px){ nav ul li{fl...

2018-12-17 07:53:53

阅读数 22

评论数 0

原创 Vue-留言列表

一:该例使用到的知识点 效果图: 1. 注意子组件引用时名称的书写方式 eg: Vue.component(‘vInput’,{}), 这里子组件名称为vInput, 则引用时需要这样书写: <v-input :username="username" ...

2018-12-13 15:04:03

阅读数 310

评论数 0

原创 vue-可排序的列表组件

该组件的功能 可排序,并且添加数据后,可以根据原数据的排序状态立即进行排序,实现的原理就是给元素绑定一个属性记录下排序后的状态

2018-12-13 13:55:42

阅读数 319

评论数 1

转载 iframe API用法

代码: parent.html <head> <script type="text/javascript"> function say(){ alert("par...

2018-12-10 15:47:53

阅读数 317

评论数 0

原创 正则表达式replace()小案例

** 正则表达式中replace()的一个案例 String.method('news',function(){ var entity ={ quot: '"', lt: '<...

2018-12-10 13:08:02

阅读数 82

评论数 0

原创 HTML email

HTML邮件 规则: 必须使用table布局,必须使用内联样式,不要使用margin与padding,定位,等。 案例: 设计: 这里你可以将图片分为3行,然后给有内容的部分,td设置vertical-align=top,即可快速的进行布局 代码: <table cellpad...

2018-12-09 21:41:10

阅读数 238

评论数 0

原创 js分页

方法一 一: 先看效果图 二:主要功能: 上一页,下一页,跳转,尾页, 三: 代码 index.html: <!DOCTYPE html> <html lang="en"> <head> ...

2018-12-04 16:01:35

阅读数 601

评论数 0

提示
确定要删除当前文章?
取消 删除