cyang233的博客

原创 阿里云服务器申请ssl证书 宝塔面板部署

1.登录阿里云账号，点击左侧云安全下的ssl证书 2.点击选购证书 3.配置如下 点击立即购买 4.支付 5. 6.点击证书申请并填写信息 7.解析域名 照着填就行 8.填完之后验证 过一会 成功之后是这个样子的 然后点击下载 9 打开宝塔面板 点击网站 设置 10.将下载的对应内容复制到对应区域 右上角强制https 单击保存就可以啦 perfect，大功告成，不要问我为什么挡网址 没设计，太丑了 防止你们笑话我 ...

原创 使用 bootstrap-vue

1.创建一个vue项目 vue create demo1 网慢的话可以使用cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 2.下载jquery npm install jquery 3.下载bootstrap-vue和 bootstrap cnpm install bootstrap-vue bootstrap axios 4.在项目公共文件夹中的index.html文件中添加如下代码： <link typ

原创 小程序 云开发 获取不到数据库记录

原创 微信小程序--监听对象属性变化

本以为小程序会跟vue差不多有像watch一类的方法，好吧并没有。百度了很多，看了很多大神写的案例。奈何天资不太行，虽然效果有了，但还是不太懂。 app.js //监听属性值函数 watch:function(obj,val,method){ let vl = ''; Object.defineProperty(obj,val,{ configurable:true, enumerable:true, set:function(nval){

原创 踩坑--小程序给数组中的数组赋值

如图，写一个tab切换，为了不每次切换标题都要重新获取数据 //titles对应的是标题，content对应标题下内容 for(let i=0;i<that.data.titles.length;i++){ that.data.content[i] = []; } 现在结构就是content是大数组，里面包含着每个标题对应的内容数组，就是这样 然后在赋值出了问题。经过疯狂的百度后 大概就是setData赋值规则，详细的大家自行百度吧 ...

原创 v-for数据源动态更新

如图所示，数据源是一个包含5个数组的数组 <ul class="addlist" ref="lis" v-if="flag"> <li v-for="(item,index) in splitarr[ind]" :key="index"> <div class="li-t"> <span>{{item.name}} &emsp;&emsp; {{it

原创 typescript

1.安装 npm i typescript -g 2.初始化 tsc --init 初始化项目 tsc ./src/xxx.ts 编译某个文件 tsc -w 检测变化并编译 tsconfig.json 文件 {“compilerOptions”:{ “outDir”:"./dist", //输出文件夹 “rootDir”:"./src" //源文件夹 }} 常见类型 boolean...

原创 React-native导航总结

1.安装依赖 npm install @react-navigation/native npm install @react-navigation/stack npm install @react-navigation/bottom-tabs npm install @react-navigation/material-top-tabs react-native-tab-view npm inst...

原创 前端优化

内容部分 1.减少http请求，通过合并文件等方式 2.减少DNS查找 3.避免重定向 4.缓存Ajax 5.延迟加载组件 6.使用预加载 7.减少Dom元素的数量 8.少用iframe css部分 1.避免使用CSS表达式 2.选择舍弃@import 3.避免使用滤镜 4.把样式表放在顶部 js部分 1.去除重复脚本 2.减少dom访问 3.把脚本放在底部 4.把JavaScript和CSS放到...

原创 React组件传参

1.基础传参 //父组件 //1.传递数据 <Child age={this.state.age}></Child> //2.传递方法 setAge =v=>this.seState({age:v)} <Child age = {this.state.age} setAge{this.setAge.bind(this)}></Child> /...

原创 百度Map

注册 搜索百度地图开发平台，登录后进入到控制台。应用管理=>我的应用=>创建应用； 输入应用名称、选择应用类型（根据需要，输入域名白名单， 这时会在应用表格中，生成一条新记录，有对应的应用编号、应用名称和访问应用（AK）等；然后就可以根据官方文档自己创建地图； 使用 var map = new BMap.Map("allmap"); // 创建Map实例 map.centerAn...

原创 react面试题

1.React 优势 答： 1、React 速度很快：它并不直接对 DOM 进行操作，引入了一个叫做虚 DOM 的概念，安插在 javascript 逻辑和实际的 DOM 之间，性能好。 2、跨浏览器兼容：虚拟 DOM 帮助我们解决了跨浏览器问题，它为我们 提供了标准化的 API，甚至在 IE8 中都是没问题的。 3、一切都是 component：代码更加模块化，重用代码更容易，可维护性高。 4、...

原创 前端面试题

1.客户端存储 localStorage 和 sessionStorage localStorage 有效期为永久，sessionStorage 有效期为顶层窗口关闭前 同源文档可以读取并修改 localStorage 数据，sessionStorage 只允许同一个窗口下的文档访问，如通过 iframe 引入的同源文档。 Storage 对象通常被当做普通 javascript 对象使用：通过设...

原创 前端面试题

1.如何解决0.1+0.2！=0.3 这个问题？ 当计算机计算0.1+0.2的时候，实际上计算的是这两个数字在计算机里所存储的二进制，0.1和0.2在转换为二进制表示的时候会出现位数无限循环的情况。js中是以64位双精度格式来存储数字的，只有53位的有效数字，超过这个长度的位数会被截取掉这样就造成了精度丢失的地方。在对两个以64位双精度格式的数据进行对阶的处理，对阶指的是将阶码对齐，也就是将小数点...

原创 js面试题2

1.call()和apply()的含义和区别？ 含义： call() :调用一个对象的方法，用另一个对象替换当前对象。例如：B.call(A,args1,args2);就是A对象调用B对象的方法。 apply() ：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A,arguments);就是A对象应用B对象的方法。 相同点： 方法的含义是一样的，即方法功能是一样的。 第一...

原创 JS面试题

1.JavaScript 的组成 ECMAScript（核心）：JavaScript 语言基础 DOM（文档对象模型）：规定了访问 HTML 和 XML 的接口 BOM（浏览器对象模型）：提供了浏览器窗口之间进行交互的对象和方法 2.offsetWidth/offsetHeight,clientWidth/clientHeight 与 scrollWidth/scrollHeight 的区别？ o...

原创 socket.io基本用法

服务端 服务端运行后会在根目录动态生成socket.io的客户端js文件 客户端可以通过固定路径/socket.io/socket.io.js添加引用 <script type="text/javascript" src="/socket.io/socket.io.js"></script> io.emit('user connect',user+'进入聊天室'); e...

原创 Vuex

vuex是一个专门为vue.js应用程序开发的状态管理模式。通俗点说就是我们项目中需要共享的一些数据的管理容器，这里的状态就是数据。 Vuex常用对象 state：存储状态，也就是变量 getters：对数据获取之前的再次编译，可以理解为state的计算属性。我们在组件中使用 $sotre.getters.fun() mutations：提交状态修改。也就是set、get中的set，唯一修改sta...

原创 Git

1.在dom中全局配置 git config --global user.name "Your Name" git config --global user.email "xxx@xx.com" 2.在项目目录初始化 例： 上传所有文件 git add . 上传指定文件 git add 文件名 添加到版本库 git commit -m "添加到版本库" 时光机 git log //...

原创 Vue跨域方式

** 1.axios ** 1.在cmd窗口输入以下命令安装到项目目录 cd 项目目录 cnpm install axios -S 2.在项目的main.js中挂载 import axios from 'axios' Vue.prototype.$http=axios; //过载axios到vue的原型公共方法上 //所有的vue的实例都将拥有$http 3.get方式 get方式 this.$...

原创 Vue

Vue：渐进式js框架 this在Vue中指向的是当前Vue的实例 组成部分： 1.模板：包括指令(将控制和html联系在一起)和html内容 2.样式 3.控制： 包括 data数据，el指定模板和 methods方法 指令 1.文本渲染指令 {{js表达式}} v-text v-html：可以渲染数据中的html标签 条件渲染指令 v-if=“表达式值”：通过移除dom元素进行隐藏 v...

原创 ES6

let与const let：局部变量声明 只能再一对{}里用 2.不能重复声明 3.不会变量提升（在变量声明前访问会报错） const：常量声明 1.声明必须赋值 2.赋值不能修改（简单数据类型） 3.建议变量名 大小 解构 对象 let{name,age} = {name:"cyang",age:18} let{name:foo} ={name:"cyang"} //foo值就是cyan...

原创 ES6

1.函数 箭头函数 => 左边是函数的参数 => 右边是函数的执行语句，也是返回值 => 如果参数不止一个用()包裹参数 => 如果执行语句有多条用{} => 如果执行语句有多条，返回用return关键字 如果返回的是对象要用（）括住 => 箭头函数的this指向当前的执行环境 例 arr.reduce((a,b)=>a+b) arr.forEach(...

原创 js对象常用方法

1.Object.is(a,b):判断a和b是否相同，返回布尔值 2.Object.assign(对象名1，对象名2)：克隆对象 3.Object.keys()：返回对象可枚举的属性和方法的名称。 ES6 1.对象的简写(变量名和对象的键一致时) var name = "cyang"; var age = 20; var obj = { ...

原创 JS中Math函数的常用方法

1.Math.PI ：圆周率 2.Math.round(Math.random()*(上限-下限)+下限)：求某个范围内的随机整数。 3.Math.max() , Max.min() :最大值与最小值 4.Math.round() 四舍五入 。 5.Math.abs() 求绝对值. 例：Math.abs(-1) ;// 1 6.Math.ceil() ：小数进1。例：Math.ceil(3.1);...

原创 js数组常用方法

1.arr.unshift(a)：在数组开头插入元素a。 2.arr.shift()：删除数组的第一个元素并返回这个元素。 3.push(a)：在数组最后插入a。 4.pop()：删除数组的最后一个元素并返回这个元素。 5.slice(a,b)：从下标a开始截取到下标b（不包含b），b不写表示截取到最后 6.splice(a,b)：从下标a开始截取b个长度的元素。 7. arr.reverse()...

原创 js字符串常用方法

1.toLowerCase(str)与toUpperCase(str) ： 将str转为小写与大写。 2.indexOf(n): 返回某个指定的子字符串(n)在字符串中第一次出现的位置。 lastIndexOf(n): 返回某个指定的子字符串(n)在字符串中最后出现的位置。 3.substring(x,y): 提取字符串中x和y之间的字符。 4.substr(x,y): 返回从下标x开始截取y个长...

原创 jquery简单的选项卡插件

引入jq和插件 <script src="../js/jquery-3.3.1.js"></script> <script src="xxk.js"></script> 简单加css <style> *{margin: 0;padding: 0;} .all span{ display: inline-block; ...

原创 鼠标经过图片四周加线条

css <style type="text/css"> *{ margin: 0;padding: 0; } .box{ overflow: hidden; position: relative; margin: 120px auto; width: 400px; height: 255px; } .box ...

原创 js 吸顶效果

<style> *{margin: 0;padding: 0;} .header{ height: 120px; background-color: lightgrey; } .all{ padding-bottom:66px; } .all .nav{ position:fixed; top:0; left:0; } .nav{ widt...

原创 javascript

1.引入方式 1.内嵌式：例 2.外链式：例 3.行内式：例 2.注释语句 单行：//注释语句 多行：/注释语句/ 3.输出方式 (window可省略) alert(“内容”) 弹出框 document.write(“内容”):body内输出 console.log(“内容”):控制台输出 4.基本数据类型 string：“字符串” number：数字 boolean：布尔 （true/fal...

原创 不完善的计算器 = -=

计算器 AC ← % ÷ 7 8 9 x 4 5 6 - 1 2 3 + ¤ 0 . = </body>

原创 js计算元年

<script> var year=prompt("请输入一个年份"); if(year%100==0&&year%400==0||year%100!=0&&year%4==0){ alert(year+"是一个元年"); }else{ alert(year+"不是一个元年"); } </script> ...

原创 js css操作

行内样式：例：el.style.fontSize = “13px” 传统css样式改变：例：el.className = “ha”;设置元素的类名 classList：add（） remove（） toggle（） 获取到css最终值：document.defaultView.getComputedStyle(el,null).css属性 css高度获取： clientHeight：元素内容的高 ...

原创 利用javascript实现简单的图书增减操作

书名：<input type="text" id="shu"> 价格：<input type="text" id="jia"> <button onclick="add()">添加</button> <table width="300px" border="1px" id="bg"> <tr> <td&...

原创 dom

当浏览器区解析html标签完毕后会生成一个dom树形结构 会有三种类型节点：1.元素类型 2.文本类型 3.类型属性 节点之间的关系：1父子 2.兄弟 Dom核心方法 操作html有三种方式：1.html方式 2Dom核心方法 3.xml方式 Dom属性 属性操作 getAttribute(属性名)：获取属性 setAttribute(属性名，属性值)：设置属性 创建：createElement(...

原创 js

document.getElementById(“id值”)：通过id获取元素 document.getElementByName(name)：通过name名称获取元素 document.getElementsByTagName(“标签名”):通过标签名获取元素，可以获取多个 document.getElementByClassName(“类名”)：通过类名获取元素 document.queryS...

原创 js

字符串创建 var str = new String(“我爱我的祖国”) var str = “我爱我的祖国” var str =‘我爱我的祖国’ 特点，双引号字符串可以包含单引号 单引号里面可以包含双的 用new创建的两个字符串即使值一样也不相等 搜索 搜索字符在字符串所在的下标索引 str.indexOf(“字符”) 搜索不到 返回-1 indexOf(“字符”) 从0的位置开始搜索 标记: ...