galaxy222111-优快云博客

原创强烈分享一个Vue的模板！！！！！

一个vue基础模板，会持续更新 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body>

2020-06-04 19:03:36 1017 2

** ## 生成类似[1-100]这样的的数组： ** let arr = new Array(100).fill(0).map((item, index) => index + 1) 数组解构赋值应用 // 交换变量 [a, b] = [b, a] [o.a, o.b] = [o.b, o.a] // 生成剩余数组 const [a, ...rest] = [...'asdf'] // a：'a'，rest: ["s", "d", "f"] 数组浅拷贝 const arr = [1, 2, 3]

2020-06-22 19:07:33 342

原创 VUE-cli 脚手架安装！！！

首先检查电脑有没有装node.js和npm 这里建议在装一个cnpm，是淘宝的团队研发的，服务器在国内，比较快链接如下cnpm链接或者直接复制这个：npm install -g cnpm --registry=https://registry.npm.taobao.org 接下来查看一下cnpm的版本，如果出现下面的情况就说明安装完毕然后就可以安装脚手架了输入：cnpm i -g @vue/cli 就可以安装了，下载好之后查看一下版本这样就算下载好了接下来就可以创建项目了输入 vue c

2020-06-16 09:50:19 272

原创手写VUE组件！！！！TreeSelect

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link href="https://cdn.bootcdn.net/

2020-06-12 18:36:46 418

原创教你用canvas画动态时钟

话不多说，上代码 <canvas id="canvas" width="500" height="500" style="border: 1px solid red ;background:#000"></canvas> <script> var canvas = document.getElementById('canvas'); var cxt = canvas.getContext('2d'); functi

2020-06-09 14:36:10 236

原创 Vue！！！教你如何子组件向父组件传值！！！

首先我们得知道，组件的数据是会受父级页面影响的，详情可以看官方文档首先这是一个基本的父传子写法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</titl

2020-06-08 19:55:33 736

原创 JS你容易忘记的小知识点

var a = 10 var b = 20 let c = a a = b b = c console.log(a,b);//20,10 a = a + b //30 b = a - b//10 a = a - b//20 var [b,a] = [a,b] console.log(a,b);//20,10

2020-06-06 16:31:44 177

原创 3分钟教你在组件上使用v-model

在组件上使用 v-model 自定义事件也可以用于创建支持 v-model 的自定义输入组件。 <input v-model="searchText"> 等价于下面的代码 <input v-bind:value="searchText" v-on:input="searchText = $event.target.value" > 当在自定义祖甲氨种使用v-model时，这个组件内的必须：将其 value 绑定到一个名叫 value 的 prop 上在其 inp

2020-06-06 16:15:19 402

原创震惊！！！！当代程序员头发现状！！！

let hair = 100000 setInterval(function() { console.log(hair--); }, 1000); 黄种人头发平均10W根

2020-06-05 11:04:35 470

原创速进！！！！Vue的一些api讲解

1.watch 观察 Vue 实例上的一个表达式或者一个函数计算结果的变化用法如下 <div id="app"> <input type="text" v-model="count">//监听 <h1>{{count}}</h1> </div> data() { return { count:1//初始数据 } }, watch: {//监听

2020-06-04 20:07:33 372

原创速进！！！教你用vue写轮播图

首先了解一下v-show和v-if的区别 <div id="app"> <h1 v-show="true">666</h1> <h1 v-if='true'>777</h1> <h1 v-show="false">666</h1> <h1 v-if='false'>777</h1> </div> <s

2020-06-03 14:37:53 701

原创教你用vue写出星星评分效果

话不多说直接上代码图 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link href="https://c

2020-06-03 14:02:41 944

原创教你用JS制作飞机大战

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * { m

2020-06-02 13:34:49 952

原创不要错过！！！30天搞定VUE之基础语法和指令

Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使

2020-06-01 20:17:25 396

原创 JS之小游戏 pet

一个网页的小游戏，养宠物，可以练习一下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> &

2020-06-01 10:31:22 867 3

原创一些JS小方法

1.补0（例如时间上的） function repairZero(val) { return val < 10 ? ('0' + val) : val } console.log(repairZero(5));//05 2.获取当天日期是周几 let now = new Date() let ww = '星期' + "日一二三四五六" [now.getDay()] console.log(ww); 3.获取指定区间随机数 console.log(Math.round(Math.r

2020-05-29 21:40:05 245

原创 js隐式转换数据类型

字符串转换number 除法转换 var a = '100' a = a / 1 console.log(a); console.log(typeof a); 乘法转换 var a = '100' a = a * 1 console.log(a); console.log(typeof a); 加法转换 var a = '100' a = a-0 console.log(a); console.lo

2020-05-27 17:26:51 180

原创 Cookie和缓存storage

Cookie，有时也用其复数形式 Cookies。类型为“小型文本文件”，是某些网站为了辨别用户身份，进行Session跟踪而储存在用户本地终端上的数据（通常经过加密），由用户客户端计算机暂时或永久保存的信息。 Cookie是一段不超过4KB的小型文本数据，由一个名称（Name）、一个值（Value）和其它几个用于控制Cookie有效期、安全性、使用范围的可选属性组成。其中 [3] ： (1)Name/Value：设置Cookie的名称及相对应的值，对于认证Cookie，Value值包括Web服务器所提供

2020-05-27 16:19:56 241

原创 JS之date对象

1.Date() 返回当日的日期和时间。 2.getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 3.getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。 4.getMonth() 从 Date 对象返回月份 (0 ~ 11)。 5.getFullYear() 从 Date 对象以四位数字返回年份。 6.getHours() 返回 Date 对象的小时 (0 ~ 23)。 7.getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。 8.get

2020-05-22 19:25:37 154

原创 JS之math对象

1.ceil 将目标数字向上取整 console.log(Math.floor(3.1));// 输出4 2.floor 将目标数字向下取整 console.log(Math.floor(3.1));//输出3 3.round 将目标数字四舍五入 console.log(Math.round(3.1));//输出3 console.log(Math.round(3.5));//输出4 4.abs 返回目标数字的绝对值 console.log(Math.abs(-3));//输出3 5.pow

2020-05-22 19:11:03 145

原创 JS复习之字符串

①：split：把字符串分割为字符串数组例如：str.split("")默认逗号分割可在括号里添加需要的符号、 ②：search：返回查找字符的下标，不匹配返回-1 例如str.search(“aaa”) ③：toUpperCase() 方法用于把字符串转换为大写。例如str.toUpperCase() ④：toLowerCase() 方法用于把字符串转换为小写。例如str.toLowerCase() ⑤：concat：连接两个或多个字符串例如str1.concat(str2) ⑥：repeat：

2020-05-20 23:31:26 157

原创 JS复习之数组

js复习数组方法 ①：push:在末尾添加元素例如arr.push(a) //a为添加元素 ②：pop：删除并返回末尾元素例如arr.pop() ③：unshift:在开头添加元素例如：arr.unshift(a) //a为添加元素 ④：shift：删除并返回开头元素例如arr.shift() ⑤：slice:截取一段元素例如arr.slice(start,end) end>截取下标>=start ⑥：join：把数组内的所有元素转换为一个字符串例如arr.join()默认为逗号分

2020-05-20 22:37:59 161

galaxy222111的博客