Wyyyy1024-CSDN博客

原创 CSS3 filter滤镜

css3 filter 属性

2022-12-30 09:45:01 1175 1

使用npm包支持与限制不支持依赖于 Node.js 内置库的包不支持依赖于浏览器内置对象的包不支持依赖于 C++ 插件的包vant weapp安装初始化文件npm init -ynpm i @vant/weapp@1.3.3 -S --production构建 npm 包功能建议先点击微信开发者工具 --> 详情 --> 本地设置 --> 使用 npm 模块然后点击微信开发者工具 --> 菜单栏 --> 工具 --> 构建

2021-01-15 20:06:59 2686

原创微信小程序——自定义组件的使用以及组件之间的传值

自定义组件创建在项目的根目录中，鼠标右键，创建 components -> test 文件夹在新建的 components -> test 文件夹上，鼠标右键，点击新建 Component键入组件的名称之后回车，会自动生成组件对应的 4 个文件，后缀名分别为 .js ， .json ， .wxml 和 .wxss注意：为了保证目录结构的清晰，建议把不同的组件，存放到单独目录中局部使用在页面的 .json 配置文件中引用组件的方式，叫做局部引用 "usingC

2021-01-14 09:30:14 4226 1

原创微信小程序的基础知识点汇总

组件常用组件分类① 视图容器② 基础内容③ 表单组件④ 导航组件⑤ 媒体组件⑥ map 地图组件⑦ canvas 画布组件⑧ 开发能力⑨ 无障碍访问view组件类似于html中的div是一个块级元素<view class="container">`scroll-view组件可滚动的视图区域,常用来实现滚动列表效果<scroll-view class="container1" scroll-y><view>A</vie

2021-01-13 10:24:16 1995

原创 vue中keep-alive缓存的使用

keep-alive是什么？<keep-alive /> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在组件的父组件链中。使用<keep-alive />包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。应用场景在一个项目中，当我们主页跳转到列表页在从列表页跳转到详情页，我们希望我们点击过的每一个列表再次点击不需要重新发送请求，这时我们需要将页面的数据缓存下来，以保证下次不在重新发起请求，获取数据。所以我们借助vue中<keep-alive /

2020-12-28 19:07:42 435

原创 vue项目中loadsh库常用方法

lodash1.下载npm i lodash2.使用全局使用import _ form lodash按需使用import { 要使用的函数 } from loadsh常用方法_.cloneDeep(value)(深拷贝)var objects = [{ 'a': 1 }, { 'b': 2 }]; var deep = _.cloneDeep(objects);console.log(deep[0] === objects[0]);// => false

2020-12-26 19:50:08 1466 1

原创图片裁剪-cropperjs详解

图片裁剪cropperjsGitHub：https://github.com/fengyuanchen/cropperjs安装cnpm install cropperjs使用////图片必须被块级元素所包裹<div> <img id="image" src="picture.jpg"></

2020-12-25 19:04:13 3419

原创基于vant的移动端黑马头条知识点总结

移动端rem适配Vant 中的样式默认使用 px 作为单位，如果需要使用 rem 单位，推荐使用以下两个工具：postcss-pxtorem 是一款 postcss 插件，用于将单位转化为 remlib-flexible 用于设置 rem 基准值一、使用 lib-flexible 动态设置 REM 基准值（html 标签的字体大小）1、安装# yarn add amfe-flexiblenpm i amfe-flexible2、然后在 main.js 中加载执行该模块import '

2020-12-23 18:57:21 1175

原创 vue中.sync修饰符与自定义组件的v-model的使用

.sync修饰符有时我们需要父组件向子组件传值，并且子组件要修改父组件中的值是，我们一般会这样写//父组件<template> //子组件修改值父组件注册自定义事件传过来的参数通过$event来获取 <div :title='title' @update-title='title = $event'> {{title}} </div></template><script>export default

2020-12-22 19:26:20 619

原创 WebAPI中className与classList的区别

classNamewebapi中通过className更改元素样式在style标签中重新定义一个新的样式在js中直接引用：获取的元素.className=’’; <style> .box{ width: 100px; height: 100px; background-color: pink; } .size{ font-size: 30px; } </style><body

2020-12-22 18:56:41 443

原创利用json-bigint处理后台数据大数字问题

json-bigintGitHub网址：https://github.com/sidorares/json-bigint当我们在写项目的时候调用后台接口的地址需要接收一个id值例如：（id：9223372036854776000）JavaScript 能够准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算浏览器会默认解析得到数值与原数值不匹配导致404问题解决这个问题我们使用第三方插件

2020-12-21 14:29:21 1435

原创 vue项目中使用组件库设置样式不生效的解决方法

scoped实现原理实现组件的私有化，不对全局造成样式污染 ,我们使用scoped作用：声明的样式只对当前组件生效<style lang="less" scoped>.hambuger-btn { position: fixed; right: 0; width: 66px; height: 82px; display: flex; justify-content: center; align-items: center; background-co

2020-12-19 21:21:43 2031 1

原创 js中的防抖与节流

防抖与节流防抖防抖策略（debounce）是当事件被触发后，延迟 n 秒后再执行回调，如果在这 n 秒内事件又被触发，则重新计时。应用场景用户在输入框中连续输入一串字符时，可以通过防抖策略，只在输入完后，才执行查询的请求，这样可以有效减少请求次数，节约请求资源；节流节流策略（throttle），顾名思义，可以减少一段时间内事件的触发频率。应用场景：① 鼠标连续不断地触发某事件（如点击），只在单位时间内只触发一次；② 懒加载时要监听计算滚动条的位置，但不必每次滑动都

2020-12-19 15:04:49 147 1

原创 ES6中的常用语法

ES6letlet关键字就是用来声明变量的使用let关键字声明的变量具有块级作用域在一个大括号中使用let关键字声明的变量才具有块级作用域 var关键字是不具备这个特点的防止循环变量变成全局变量使用let关键字声明的变量没有变量提升使用let关键字声明的变量具有暂时性死区特性const声明常量，常量就是值（内存地址）不能变化的量具有块级作用域 if (true) { const a = 10; }console.log(a) // a is not defin

2020-12-17 09:01:05 233

原创 Vue中import与@import的区别及使用场景

importscript中的import是js的语法, 是在js中去引用css文件(ES6)模块化规范：默认导入语法 import 接收名称 from '模块标识符’使用导入组件import Vue from 'vue'导入js、css、vue、less等文件import login from '../views/login/login.vue'import './styles/index.less'导入第三方插件import Vant from 'vant'

2020-12-15 15:58:42 9061 1

原创 Vuex的基本使用

VuexVuex 是实现组件全局状态（数据）管理的一种机制，可以方便的实现组件之间数据的共享好处：① 能够在 vuex 中集中管理共享的数据，易于开发和后期维护② 能够高效地实现组件之间的数据共享，提高开发效率③ 存储在 vuex 中的数据都是响应式的，能够实时保持数据与页面的同步vuex的基本使用安装npm install vuex -save导入vuex包import vuex from ‘vuex’Vue.use(vuex)创建store对象co

2020-12-14 11:07:34 127

原创 js中实现深拷贝的4种方法

js中深拷贝的方法原生js中递归函数拷贝将数据中所有的数据拷贝下来，对拷贝之后的数据进行修改不会影响到原数据 ,两个对象或数组不共享一块内存 <script> let obj={ abc:'123', def:[{a:1,b:2,c:3},{q:8,w:9}], qwe:{e:4,f:5} } //需求将obj这个对象拷贝出一个新对象修改新对象的值不会影响原对象的值 //定义一个函数 functio

2020-12-11 15:21:00 12954 2

原创 Vue的生命周期（Vue实例产生过程）

1. 挂载（初始化相关属性）beforeCreate在实例初始化之后，数据观测和事件配置之前被调用created（重要）（获取服务器数据的最佳时期）在实例创建完成后被立即调用，实例已完成以下的配置：数据观测 (data observer)，property 和方法的运算，watch/event 事件回调beforeMount在挂载前开始之前被调用（视图挂载前）mouted（重要）（获取视图或者修改 DOM 的最佳时期）视图挂载后（el被新创建vm.$el

2020-12-10 21:25:58 357

原创 Html5与CSS3新特性

H5新特性新增的语义化标签<header> : 头部标签<nav> : 导航标签<article> : 内容标签<main> : 主体标签<aside> : 侧边标签<footer> : 底部标签<section> : 定义文档某个区域标签新增的多媒体标签<video> : 视频标签<audio> : 音频标签<video src="文件地址"></v

2020-12-08 19:10:16 118

原创 Vue——slot、slot-scope、scope、v-slot详解

slotvue2.6.0之前使用，现已经是被废弃的，2.6.0之后新增v-slot替代用于标记往哪个具名插槽中插入子组件内容。<body> <div id="app"> <slot-test>插槽的使用</slot-test> </div></body><script> Vue.component('slot-test',{ template

2020-12-07 18:49:06 3524

原创 js中遍历数组的6种方式

1.原生js中for循环 var arr=[1,2,3,4,5]; for(var i=0;i<arr.length;i++){ console.log(arr[i]) //打印每一个数组元素 }2.原生js中 for in var arr=[1,2,3,4,5];for(var k in arr){ console.log(arr[k]) //打印每一个数组元素}3.ES6中forEach()var array=[1,2,3,4,5]ar

2020-12-04 15:05:50 4615 1

原创 webpack，babel，babel-loader的关系

我们新建一个项目，会先配置webpack，然后配置babelbabel是一个编译工具，实际上，babel也是可以单独使用的webpackwebpack 是一个现代 JavaScript 应用程序的静态模块打包器。（项目打包）babelbabel 是一个 JavaScript 编译器。（把浏览器不认识的语法，编译成浏览器认识的语法。）babel-loader用来连接webpack使用babel的加载器三者的关系babel 是编译工具，把js高级语言转换成浏览器能识别的js语.

2020-12-01 20:07:15 759

原创 jQuery.extend()与jQuery.fn.extend()的区别

jquery开发插件的两个方法jQuery.fn.extend()jQuery.extend()浅拷贝只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存。改变旧对象的值，新对象的值也会改变深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。浅拷贝jQuery.extend()扩展 jQuery 类本身，为jQuery类添加类方法（静态方法）jQuery.extend({　　add: function(a, b) {

2020-12-01 19:56:46 155

原创 Webpack的简单入手

Webpackwebpack是一个流行的前端项目构建工具（打包工具），可以解决当前 web 开发中所面临的困境。webpack 提供了友好的模块化支持，以及代码压缩混淆、处理 js 兼容问题、性能优化等强大的功能，从而让程序员把工作的重心放到具体的功能实现上，提高了开发效率和项目的可维护性。基本使用创建列表隔行变色项目新建项目空白目录，并运行 npm init –y 命令，初始化包管理配置文件 package.json新建 src 源代码目录新建 src -> index.html

2020-11-29 20:55:36 104

原创 Vue全家桶——前端路由

路由路由是一个比较广义和抽象的概念，路由的本质就是对应关系。在开发中，路由分为：后端路由前端路由后端路由概念：根据不同的用户 URL 请求，返回不同的内容本质：URL 请求地址与服务器资源之间的对应关系前端路由概念：根据不同的用户事件，显示不同的页面内容本质：用户事件与事件处理函数之间的对应关系Vue-RouterVue Router（官网）是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，可以非常方便的用于SPA应用程序的开发。支持HTML5

2020-11-28 20:18:35 123

原创 Ajax——axios的详解

axiosAxios，基于 Promise 的 HTTP 客户端，可以工作于浏览器中，也可以在 node.js 中使用功能：从浏览器中创建 XMLHttpRequest从 node.js 中创建 http 请求支持 Promise API拦截请求和响应转换请求和响应数据取消请求自动转换 JSON 数据客户端支持防止 XSRF 攻击基本使用 axios.get(‘/adata') .then(ret=>{ // data属性名称是固定的，用于

2020-11-27 11:30:49 519

原创 JavaScript——Promise详解

异步调用定时任务(setTimeout、setInterval)ajax事件处理函数Promise一个 Promise 对象代表一个在这个 promise 被创建出来时不一定已知的值。它让您能够把异步操作最终的成功返回值或者失败原因和相应的处理程序关联起来。这样使得异步方法可以像同步方法那样返回值：异步方法并不会立即返回最终的值，而是会返回一个 promise，以便在未来某个时候把值交给使用者Promise 对象用于表示一个异步操作的最终完成 (或失败)及其结果值，解决异步编程的一种方案

2020-11-26 19:48:06 483

原创 Vue实例配置对象中el、template、render

三者优先级render > template > elel只在用 new 创建实例时生效提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标。可以是 CSS 选择器，也可以是一个 HTMLElement 实例在实例挂载之后，元素可以用 vm.$el 访问template一个字符串模板作为 Vue 实例的标识使用。模板将会替换挂载的元素。挂载元素的内容都将被忽略，除非模板的内容有分发插槽render字符串模板的代替方案，允许你发挥 JavaScript 最大.

2020-11-25 14:20:52 1202

原创 Vue——tab栏切换增强版

题目描述点击tab栏内容区域显示对应的内容如点击 SECTION 1 则内容区域显示对应 SECTION 1 的内容同时当前 SECTION的字体颜色变成蓝色训练目标能够理解vue 中的数据渲染能够理解 v-for, v-if , v-bind , v-click 的使用能够理解 vue 中调用函数的时候传递参数<!DOCTYPE html><html lang="en"> <head> <me..

2020-11-24 16:31:44 481

原创 Vue——插槽、具名插槽、作用域插槽

组件插槽在组件的使用时传入值通过<slot></slot>来传值插槽的基本使用1. 插槽位置Vue.component('alert-box', {template: `<div class="demo-alert-box"><strong>Error!</strong><slot></slot></div>`})2. 插槽内容<alert-box>Something b

2020-11-24 14:15:14 187 1

原创 Vue——组件的注册、使用、以及父子组件之间的传值

全局组件注册组件Vue.component("组件名称",{ data:"组件数据", //template 里面的内容是这个组件的html结果 template:'组件模板内容' });// 注册一个名为 button-counter 的新组件Vue.component('button-counter', {data: function () {return {count: 0}},template: '<button v-on:click="cou

2020-11-23 21:25:44 399

原创 Vue——指令及其使用

指令以v-开头的自定义属性。v-cloak(了解)这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。<style> [v-cloak] { display: none; }</style><body> <div id='app'>

2020-11-22 09:17:12 112

原创 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> <script src="./vue.js"></

2020-11-19 17:02:50 3516

原创 Node中内置模块、模块化(module.exports与exports)

Node.jsNode.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node 运行环境包含两个部分，分别是：V8 引擎，主要负责解析 JavaScript 代码内置 API，我们学习 Node.js 重点就是学习这些内置的 API，从而能够完成后台的开发内置模块fs文件系统fs模块是node.js官方提供的，用来操作文件的模块，他提供了一系列的属性和方法fs.readFile()用来读取指定文件的内容fs.readFile(path,[,op

2020-11-17 20:19:51 384

原创 js实现——冒泡排序、筛选数组、数组去重、数组翻转

冒泡排序 <script> // 冒泡排序 // var arr = [5, 4, 3, 2, 1]; var arr = [4, 1, 2, 3, 5]; for (var i = 0; i <= arr.length - 1; i++) { // 外层循环管趟数 for (var j = 0; j <= arr.length - i - 1; j++) { // 里面的循环管每一趟的.

2020-11-16 16:06:46 288

原创 js中———九九乘法表、打印n行n列星星、倒三角、正三角、等腰三角

九九乘法表 // 九九乘法表 // 一共有9行，但是每行的个数不一样，因此需要用到双重 for 循环 // 外层的 for 循环控制行数 i ，循环9次，可以打印 9 行 // 内层的 for 循环控制每行公式 j // 核心算法：每一行公式的个数正好和行数一致， j <= i; // 每行打印完毕，都需要重新换一行' //将结果输出到控制台中 var st.

2020-11-16 08:48:59 2263

原创 Node—JWT详解

JWT由于 Cookie 默认不支持跨域访问，所以，当涉及到前端跨域请求后端接口的时候，需要做很多额外的配置，才能实现跨域 Session 认证。JWT的工作原理客户端发送请求提交信息给服务器，验证通过后将用户信息经过加密之后生成token字符串，服务器响应将生成token发送给客户端，将token存储到localstorage或seesionstorage中，客户端再次发起请求时，通过请求头的Authorization字段，将token发送给服务器，服务器把token字符串还原成用户的信息对象，当

2020-11-14 18:35:48 1816 1

vue2和vue3 devtools

Sublime+Vscode安装包.zip

Spring框架.zip

空空如也