自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Windy_Z的博客

前端程序员小张的博客

  • 博客(20)
  • 收藏
  • 关注

原创 使用 canvas 和面向对象思想绘制流星动画

本人也是前端小白,正在努力学习的路上奔跑~最近看到一位博主大大的绘制星空博文,加上最近对面向对象编程思想的理解,也照葫芦画瓢复现了一个demo,顺便熟悉一下canvas的一些API。源代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initi.

2020-12-13 18:06:56 93297

原创 树莓派在配置开机启动服务时候遇到的问题

最近我在使用树莓派 + Raspbian部署个人服务器,在安装好Tomcat后为其配置开机启动服务时,遇到了类似以下报错。问题一:insserv: warning: script 'tomcat' missing LSB tags and overrides解决方案:我们在要配置的开机服务脚本文件里面,在第一行#!/bin/bash的下面添加以下代码即可。### BEGIN INIT INFO# Provides: bbzhh.com# Required-Start: .

2020-10-08 23:24:54 131315

原创 前端基础算法题解法

代码均为自己手写,如有错误或更优解法,劳烦小伙伴们指教哈~1、斐波那契数列// 解法一function a (n, a1 = 1, a2 = 1) { if (n <= 1) return a1 return a(n - 1, a2, a1 + a2)}let res = a(5)console.log(res)// 解法二let a1 = 1, a2 = 1function b (n) { if (n <= 1) return a for.

2020-10-04 00:58:57 241873 3

原创 React 移动端开发样式问题记录

React 移动端开发样式问题记录1、 input 输入框无法聚焦输入文字将样式中的 user-select: none; 更改为 user-select: text !important;2、 背景设置 transparent 无效经过 IOS 真机测试,transparent 在移动端支持不好,将 transparent 更改为 rgba(0, 0, 0, 0) 等效透明效果即可3、 设置了 backdrop-filter: blur(20px) 后,模糊效果出现位置偏移情况box-s

2020-09-07 14:21:04 134605

原创 使用 React 和 Threejs 创建一个VR全景项目

最近我在学习使用 React 配合 Three.js 来搭建一个可以浏览720全景图片的项目实现的是加载一张 2:1 的720全景分享一下我的创建过程一、搭建框架并安装需要的插件npx create-react-app parano // 创建一个 React 项目npm install -S typescript // 安装 typescript,这个是类型辅助插件,与全景项目关系不大npm install -S @types/three // 安装 typescript 支持的 thre.

2020-08-17 00:12:36 138420

原创 在React项目中使用redux

前言: 此博文是记录我在b站上观看redux教学视频的记录原视频链接在此 react-redux看这个视频就够了!一、安装相关的插件1、安装 reduxnpm install -S redux2、安装 redux-thunknpm install -S redux-thunk3、在 chrome 应用商店安装 redux-devtools二、引入相关插件import {createStore, combineReducers, compose, applyMiddleware} fr.

2020-08-02 18:27:15 139022

原创 React中使用路由进行父子组件的通信

最近我在学习 React.js 框架,在此记录一下我使用 react-router-dom 来实现单页应用(SPA)的路由跳转时,怎么处理父子组件间的通信。本文使用的是 HashRouter。父组件中的路由配置/** * 我使用了 react-router-dom 里面的 Switch 进行页面内的路由更新 * NavPage 是父组件 * Content 是子组件 */class NavPage extends React.Component { render () { ret.

2020-06-19 23:10:08 135173

原创 编写shell脚本实现tomcat定时重启

最近我在学生价买的低配服务器上部署了一个很吃内存的网页,导致 tomcat 内存经常溢出而崩溃。于是我上网找了一些教程编写了一个简单的每天定时启动 tomcat 的脚本,特此记录一下我的环境是 centos 71、 在某个目录新建一个 .sh 脚本文件vim tomcatStart.sh2、 在 tomcatStart.sh 文件里面写入一下代码#!/bin/bash/etc/profiletomcatPath="/usr/local/tomcat9"binPath="$tom.

2020-06-10 21:46:52 137045

原创 使用 Electron 打包 Web 应用

1、 npm 初始化项目新建一个文件夹作为项目文件夹使用 npm init 初始化文件夹生成一个 package.json 文件修改 package.json 里面的 "main": "index.js"2、 安装 electron 到项目文件夹在项目文件夹下执行以下命令npm install --save-dev electron/** * 这一步我用 cnpm 安装的,cnpm 的具体安装方法可百度 * --save-dev 可以自动更新 package.json 里面的 "

2020-06-05 11:18:53 136882

原创 微信小程序同一个方法内部多次 setData 无效解决方法

近期我在进行微信小程序开发的时候,遇到了一个函数需要多次 setData在 setData 进行完毕后,通过 console.log( this ) 来查看数据,发现数据是已经更新成功了但是页面却没有渲染出结果来因此推测可能是因为多次执行 setData,加上本身执行的操作比较复杂,导致小程序页面没能反应过来。解决方法后来通过定义一个对象,把所有要 setData 的数据都存放进对象里面,等执行的差不多的时候再一次性通过 setData 方法把数据更新过去let setData: any = {

2020-05-22 16:53:33 136245

原创 微信小程序实现毛玻璃弹窗效果

使用方法:使用 backdrop-filter : blur()配合background : rgba()来实现弹窗的毛玻璃效果。优点:这种方式省去了多设置一个after伪类来进行背景模糊的麻烦而且backdrop-filter : blur()是自动把该元素后面的背景进行模糊处理,而不需要指定固定的背景来进行模糊Demo代码:WXML 页面:<view class='bg_contain'> <view class='blur_demo'></view&

2020-05-17 14:48:54 140889 2

原创 jQuery学习笔记

前言此博文是笔者在w3school学习jQuery时整理的笔记,有所不足,欢迎大家批评指正~1. jQuery语法基础语法:$(selector).action()$ 为 jQuery 的简写// selector可以为this,id,class名称,标签名字,属性文档就绪函数$(document).ready(function(){ //function内容});...

2020-04-23 20:23:01 140728

原创 响应式布局学习

1. 响应式布局简介响应式布局是指通过判断设备类型、或设备的屏幕宽度来呈现不同的显示效果。比如一个网页,在电脑端和手机端的显示是不一样的。2. 媒体设备类型常见的媒体设备类型有:screen、print等在<style>或<link>中加入 media="print" / media="screen" 来指定样式应用的媒体类型3. 简化如果每个不同的样式...

2020-04-23 16:18:46 136727

原创 Grid布局学习

1. grid布局简介与对比简介:grid采用网格布局方案,把一块区域划分为多个网格,然后分别用元素去填充这些网格。与flex布局对比:整体布局理念与flex有点类似,但grid布局在实现固定区域布局的时候显得更灵活更易用。flex布局是基于弹性盒子模型,让元素按先后顺序塞进大盒子里,可以说是简化的float布局。grid布局则是类似于表格,用一个大网格来划分出若干个小网格,元...

2020-04-23 16:17:34 135889

原创 JS学习笔记

前言本学习笔记系作者在学习JS时,摘抄自W3SCHOOL1.运算符取幂运算符(ES7):var x = 5;var z = x ** 2; //结果为25,等同于Math.pow(5,2)2. 数据类型2.1 数据类型基本数据类型:number,string,boolean,undefined,null引用数据类型:object,函数,正则表达式注意:js数组属于对象,...

2020-04-23 00:12:45 137407

原创 Animation学习笔记

Animation的学习1. Animation基本用法<!--由@keyframes来定义新的animation动作-->@keyframes animation1{ 0%{ transform:translate(100px,200px); } 100%{ transform:translate(0px,0px); }}@keyframes anima...

2020-04-22 00:02:36 137537

原创 CSS学习笔记

前言这篇博客是我的CSS学习笔记1. float布局知识点:1. 设置浮动:float:none/left/right2. 设置float布局将脱离文档流,不会占据页面的空间3. 浮动元素的外边缘不会超过父元素的内边缘3. 浮动元素不会相互重叠4. 浮动元素只能左右浮动5. 浮动元素的display属性将完全失效并可以设置宽高,不会独占一行6. 清除浮动:clear:bot...

2020-04-21 17:57:29 138619

原创 Canvas的使用

Canvas的使用1. 创建<canvas>创建<canvas>元素并声明width、height和<canvas width="600" height="400"></canvas>2. JS中获取组件1. JS获取组件//querySelector返回值类型为静态NodeList集合,是克隆整个对象,所以速度慢var mycan...

2020-04-21 11:27:20 135300

原创 前端学习之路 --ES6新特性

#前言这篇博客是我在b站进行学习es6课程时的笔记总结与补充。此处贴出up主的教程视频地址:深入解读ES6系列(全18讲)1、ES6学习之路1.1 ES6新特性1. 变量2. 函数3. 数组4. 字符串5. 面向对象6. Promise7. generator //类似于Promise8. 模块化1.2 变量1.2.1 let、var、const和作用域知识点:...

2020-04-19 17:39:52 136090

原创 我的第一篇CSDN博客 --记MarkdownPad2的安装使用

1、前言为了即将到来的面试做准备,以及记录一下平日里自己的学习过程和生活日常,我开始进驻CSDN啦!这就是我的第一篇博客(有点小激动)~作为一只新手,首先记录一下今晚的编写博文的学习过程吧~2、使用工具客户端插件MarkdownPad2awesomium_v1.6.6_sdk_win.exe3、Markdown的语法3.1 多级标题<!--使用#开...

2020-04-17 11:48:24 135078

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

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