- 博客(30)
- 收藏
- 关注
原创 Vue 父子组件之间的通讯
1,子组件获取父组件参数 --- props <Log :parentID="1"></Log> <-- 子组件获取 --> props:['parentID']2,子组件调用夫组件事件 --- $emit() <Log @alert="alert"></Log> <-- 子组件调用 --> <button @click="alert"></button> .
2020-12-18 10:47:10
114
原创 2020-12-16 swiper 3D轮播
1,安装swiper npm install swiper --save2,引入swiper 在main.js中引入css import "swiper/swiper-bundle.css";(现在安装的试swiper6的版本,不同的swiper版本此处的样式引入不同)3,注意: 需要根据自己的需求修改scss样式<template> <div class="banner"> <div class="swiper-conta.
2020-12-16 16:57:18
298
原创 uni-app(2)
本笔记仅记录了一些本人常用到的,具体请查看https://uniapp.dcloud.io/ 8,uni-app中的界面 (1),交互反馈(提示) 1),uni.showToast({ title, <!--提示的内容,长度与 icon 取值有关--> ...
2019-06-04 14:35:44
402
原创 uni-app(1)
本笔记仅记录了一些本人常用到的,具体请查看https://uniapp.dcloud.io/ 1,uni-app的代码结构 (1):pages => 存放页面 static => 存放静态资源(图片,字体图标) pages.json => 存放路由跳转地址 (2):pages.json的...
2019-06-03 11:19:40
878
原创 关于vue/cli 3.0 版本的一些问题
1 , 安装npm i -g @vue/cli ; 2 , 创建项目 vue create projectName ;3 , 选择项目类型(按上下键位)4 , 如果想要修改端口号以及webpack配置 需要你在根目录下面创建一个vue.config.js关于vue.config.js的配置 <!-- axios代理 --> ...
2018-08-29 08:50:28
780
原创 简单的日历插件
;(function($){ $.fn.extend({ kalendar:function(options){ //配置默认参数 let defaults = {height:250,width:300,backgroundColor:'white'}; let week = ['日','一','二','三','四','五','六'] ; ...
2018-08-13 01:07:03
311
原创 瀑布流布局
function init(parent,child){ // 获取最小值的下标 function getMinIndex(arr , min){ for(let i in arr){ if(arr[i] === min){ return i ; } } } //获取列 let cont = $(parent) ;...
2018-08-09 02:59:51
133
原创 canvas文字粒子
let canvas = document.getElementById('canvas') ;let cxt = canvas.getContext('2d') ;let w = canvas.width ;let h = canvas.height ;let text = document.getElementById('text') ;let button = document...
2018-07-13 11:27:58
636
原创 node.js随笔(1)
1 , node.js开启服务 let http = require('http') ; http.createServer(function(req,res){ if(req.url !== '/favicon.ico'){ <!--设置访问头--> res.writeHead(200,{'Co...
2018-07-10 21:48:58
127
原创 水平垂直居中
1 , 利用表格的特性<!--父级-->parent{ width:500px ; height:500px; display:table-cell ; text-align:center ; vertical-align:middle ; }<!--子级-->child{ display:inline-bl...
2018-07-09 23:11:26
131
原创 JQ插件(Tab)
1 , tab类 -> 配置参数 -> 对象 -> Prototype2 , ;$(function(){ <!--定义类--> let Tab = function(tab){ let _this = this ; this.tab = tab ; <!--保存单个组件-->...
2018-07-08 18:43:56
464
原创 HTML5中的音频和视频
1 , 标签audio(音频) , vidio(视频)source2 , 引入<audio src = '地址'></audio>3 , 媒体元素controls:显示或隐藏用户控制界面autoplay:是否自动播放loop:媒体是否循环播放currentTime:开始到播放现在所用的时间duration:媒体总时间volume:0....
2018-07-07 23:05:57
688
原创 JQ插件
1 , 插件的基本步骤 ;(function(){ <!--插件部分--> })(jQuery);2 , 插件的书写 (1):$.fn.fnName = function([options]){ <!-- 缺点:一次只能传入一个函数 --> } (2):$.fn...
2018-07-06 22:20:53
505
原创 微信小程序生成二维码
1 , 二维码的生成 qrcode.js <!-- 1 , 下载qrcode.js(utills文件夹下) 2 , 引入qrcode let QRCode = require('../../utils/weapp-qrcode.js') ; let qrcode; 3 , 配置...
2018-07-06 16:03:15
686
原创 DOM
DOMDocument(文档) Object(对象) Model(模型)常用节点类型元素节点 --- 1 属性节点 --- 2文本节点 --- 3注释节点 --- 8文档节点 --- 9查看节点类型obj.nodeType (返回值是数字)obj.nodeName (返回值是大写的元素节点 'DIV')查看属性节点obj.attribute[name] ;节点关系...
2018-07-05 10:39:57
132
原创 js中的事件
1 , pc端常见的事件 (1):onload (页面被加载) (2):onchange (表单失去焦点时执行) (3):oninput (表单内容发生改变时执行) (4):onblur (失焦时执行) (5):onfocus (得到焦点时执行) (6):onmousedown (鼠标按下) (7):onmouseover (鼠标移入) ...
2018-07-05 10:37:34
178
原创 一个简单的日历
<script>function createCalendar(obj){ let day = null ; let lastDay = null ; let nowLastDay = null ; let year = null ; let month = null ; //创建总框 let div = document....
2018-07-04 17:55:42
165
原创 js中的date()函数
1 , 获取当前时间 let date = new Date() ; 2 , 获取当前的年份 let year = date.getFullYear() ; <!-- let y = date.setFullYear(number) ; 设置年份 -->3 , 获取当前月份 let month = da...
2018-07-03 22:28:31
3100
原创 js 中的一些位置方法
<!--原生js-->1 , 获取浏览器可视区的宽高 document.documentElement.clientHeight ; document.documentElement.clientWidth ; 2 , 获取内容区域可视区的宽高 document.body.clientWidth/offsetWidth ; docume...
2018-07-02 15:44:28
466
原创 关于js中的继承
1 , 类的申明 let obj = function(){ this.name = 'heh' ; } <!--es6中类的申明--> class obj = { constructor () { this.name = 'heh'; } getName(){ ...
2018-07-01 17:11:11
135
原创 正则表达式
正则表达式 <!-- g:表示全局 i:表示不区分大小写 m:表示多行 d:表示数字 D:表示非数字 s:表示空格 S:表示非空格 w:表示字符 W:表示非字符...
2018-07-01 14:57:38
149
原创 Canvas(3)
12 , canvas中的贝塞尔曲线 (1):二阶贝塞尔曲线 ctx.quadraticCurveTo(cpx,cpy,x,y); <!-- cpx 贝塞尔控制点的 x 坐标 cpy 贝塞尔控制点的 y 坐标 x 结束点的 x 坐标 y 结束点的 y 坐标...
2018-06-28 19:51:26
295
原创 js中对象创建的几种方法
1 , 创建对象的几种方法 (1):字面量方式 let obj = { name:"123", age:18, getAge:function(){ console.log(this.age) ; } } (2):Objec...
2018-06-26 21:29:01
169
原创 Canvas小球碰撞和连线效果
<!-- html部分 --><canvas id="canvas" style="border: 1px solid #cccccc"></canvas><!-- js部分 -->//画布let c = document.getElementById('canvas') ;let cxt = c.getContext('2d') ;//画布的宽高...
2018-06-23 12:53:44
1155
原创 Canvas(2)
6 , canvas中的文字 cxt.font = "italic small-caps bold 12px arial"; <!-- font:设置字体大小和字体的样式 italic:斜体 small-caps:规定字体变体 bold:加粗 12px:字体大小 arial:字体...
2018-06-23 12:31:12
180
原创 canvas(1)
<!-- 角度和弧度的关系: 180° = π rad(弧度单位)-->1 , canvas的画布 let xtc = document.getElementById('canvas').getContext('2d') ; 2 , canvas的画布大小 在行间样式设置width和height,否则会出现画布模糊等问题 <c...
2018-06-22 21:07:43
112
原创 线性渐变和径向渐变
1 , 线性渐变linear-gradient([方向 ,] color1 距离 , color2 距离,...)<!-- 方向:right/left/top/bottom/to right/0deg 距离:10px/10%-->2 , 径向渐变radial-gradient(中心点(x,y) ,渐变的形状 , 渐变的大小 , color1 距离1 , col...
2018-06-22 20:14:05
388
原创 Vuex
1 , 安装 (1):直接下载 https://unpkg.com/vuex@2.0.0 (2):npm npm install vuex --save ; 2 , Vuex的创建 let store = new Vuex.Store({ state:{ <!--数据--> ...
2018-06-18 13:18:21
168
原创 Cookie
1 , cookie的查找 document.cookie2 , cookie的设置 document.cookie = 'user = "hhh"'3 , 完整的cookie 'user=值; expires=失效时间; path=路径访问; domain=域名访问; secure= 安全的https限制通信' ;4 , cookie的删除 将失效时间设置为...
2018-06-17 11:06:24
118
原创 Vue
1 , 基本雏形 <!--html部分--> <div id='box'> {{ message }} </div> <!--js部分--> let app = new Vue({ <!--挂载点--> ...
2018-06-02 19:36:51
199
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人