- 博客(476)
- 收藏
- 关注
RSS订阅原创 Nodejs - 路径模块和http模块
文章目录一、什么是path路径模块二、path模块的使用1. 导入path模块2. 路径拼接3. 从路径中，将文件名解析出来4. 获取路径中的扩展名部分三、http模块1. 导入http模块2. 创建web服务器的步骤一、什么是path路径模块path模块是Node.js官服提供的，用来处理路径的模块。二、path模块的使用1. 导入path模块const path = require('path')2. 路径拼接path.join()方法，用来将多个路径片段拼接成一个完整的路径文件
2022-03-25 16:21:20
7725
1
原创 nodejs - 模块化和文件系统
文章目录一、引入其他模块二、向外部暴露属性或方法三、定义文件模块四、全局对象global五、node执行模块时做的操作参数详解六、包七、npm一、引入其他模块在node中，通过required()函数来引入外部的模块required()可以传递一个文件的路径作为参数，node将会自动根据该路径来引入模块使用require()引入模块以后，该函数会返回一个对象，这个对象代表的是引入的模块在Node中，一个js文件就是一个模块在Node中，每一个js文件中的js代码都是独立运行在一个函
2022-03-24 19:10:27
3550
原创 小程序 - 样式
文章目录一、样式 WXSS1. rpx 尺寸单位2. 样式导入3. 选择器一、样式 WXSS与css相比， WXSS扩展的特性有 ：响应式长度单位 rpx样式导入1. rpx 尺寸单位rpx : 可以根据屏幕宽度进⾏⾃适应设计稿公式 ：1. 确定设计稿宽度 pageWidth2. 计算⽐例 750rpx = pageWidth px 因此 1px=750rpx/pageWidth/* pages/demo03/demo03.wxss */view { width: 200r
2022-02-26 10:12:41
241
原创 小程序 - 模板语法
文章目录一、小程序结构目录1. 全局配置app.json2. 页面配置page.json3. sitemap配置sitemap.json二、小程序模板语法1. 数据绑定2. 运算3. 列表渲染和对象渲染1. 列表渲染2. 对象渲染4. block5. 条件渲染1. wx:if2. hidden6. 事件的绑定1. 如何获取页面的值2. 把输入框的值赋值到data中7. 事件的绑定（按钮）1. num添加传递的数据一、小程序结构目录1. 全局配置app.jsonapp.json 是当前⼩程序的全局
2022-02-25 19:50:26
587
原创 函数的节流与防抖
文章目录一、函数的节流模拟场景使用underscore库的debounce方法二、手动封装函数的节流一、函数的节流现在有一个场景, 用户在输入框里面输入数据, 用户每输入一次数据, 方法都会往服务器请求一次. 这样对服务器的压力会非常大模拟场景鼠标移动, 修改数值<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-C
2021-12-31 20:23:06
492
原创 Vue3 常用 Composition API (组合式API)
文章目录一、setup1. setup的两种返回值一、setupsetup是Vue3.0中的一个新的配置项, 值是一个函数,组件中所用到的 数据, 方法 等待, 均要配置在setup中1. setup的两种返回值若返回一个对象, 则对象中的属性, 方法, 在模板中均可以直接使用<template> <div> <h1>名字:{{name}}</h1> <h2>年龄:{{age}}</h2> &
2021-12-28 11:12:26
2321
2
原创 Vue - 使用vite创建工程
文章目录一、什么是vite二、vite使用流程一、什么是vitevite是新一代前端构建工具二、vite使用流程创建工程 : npm init vite-app <project-name>进入工程目录 : cd <project-name>安装依赖 : npm install运行 : npm run dev...
2021-12-26 15:55:23
379
原创 Vue - element-ui
文章目录一、使用element-ui1. 安装2. 引入Element二、按需引入1. 安装babel-plugin-component2. 将babel.config.js修改为3. 按需引入4. 启动时遇到的错误一、使用element-ui1. 安装npm i element-ui2. 引入Element在main.js引入import Vue from 'vue'import App from './App.vue'// 引入ElementUI组件库import Element
2021-12-24 16:52:34
388
原创 Vue - vue-router - 路由守卫
文章目录一、全局前置beforeEach1. 全局前置beforeEach2. 实现二、需求二三、全局后置守卫 afterEach1. 修改title为自己的title一、全局前置beforeEach当 Local Storage 里面存储的 name 是 zhangsan 的时候, 点击消息才显示消息内容1. 全局前置beforeEach给router添加一个路由守卫 beforeEach语法 :router.beforeEach((to, from, next)=>{})
2021-12-24 14:51:04
1826
2
原创 Vue - mapState, mapGetters,
文章目录# 一、使用mapState生成计算属性mapState用于帮助我们映射state中的数据为计算属性.自己手写计算属性![在这里插入图片描述](https://img-blog.csdnimg.cn/745d22617e1e4505bf48154131f34c85.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5a2m5Lmg5Lit55qE5bCP6I-c6bifLg==,size
2021-12-22 20:11:20
466
原创 Vue - 动画
文章目录一、定义动画二、动画效果1. 过渡的样式元素进入的样式元素离开的样式2. 给transition指定name属性3. transition的apper属性三、过渡效果1. 使用过渡效果完成同样的功能四、多个元素过渡五、集成第三方动画1. 安装animate.css2. 引入3. 类一、定义动画<style> .come { animation: move 1s; } .go { animation: move 1s reverse; } @key
2021-12-21 13:55:43
429
原创 Vue - 全局事件总线
文章目录一、全局事件总线安装全局事件总线使用全局事件总线解绑全局事件总线一、全局事件总线可以实现任意组件间的通信安装全局事件总线使用全局事件总线接收数据组件向接收数据, 则在组件中给$bus绑定自定义事件, 事件的回调在组件自身提供数据this.$bus.$emit("xxxx", 数据)解绑全局事件总线最后可以在beforeDestroy钩子中, 用$off解绑当前组件所用到的事件...
2021-12-20 20:11:01
242
原创 Javascript - 浏览器本地存储
文章目录一、什么是浏览器本地存储二、怎么实现浏览器本地存储读取本地存储的数据删除本地存储的数据三、sessionStorage一、什么是浏览器本地存储比如上面的搜索历史记录, 就保存在浏览器本地存储里面二、怎么实现浏览器本地存储在window身上有一个localStorage属性, 这个属性有一个setItem方法, 接收两个参数,一个key,一个value.注意 : key和value必须都是字符串<!DOCTYPE html><html lang="en">
2021-12-20 14:54:08
1148
原创 Vue - mixin 和 插件
文章目录一、mixin二、插件1. 创建插件2. 引入插件3. install方法介绍一、mixin两个组件共享一个配置.比如这里的两个组件有同一个方法, 那么就可以把这个方法提取出来mixin.jsexport const mixin = { methods: { showName() { console.log(this.name); } },}然后在需要使用的组件内引入<script> // 引入一个mixin import
2021-12-19 16:39:40
623
原创 Vue - 监视属性和 Vue检测数据改变的原理
文章目录一、监视属性 - watch一、监视属性 - watch通过vm对象的$watch() 或 watch 配置来监视指定的属性
2021-12-15 16:46:10
1157
原创 CSS - 媒体查询
文章目录一、什么是媒体查询1. 语法规范1.1 mediatype 查询类型1.2 关键字1.3 媒体特性一、什么是媒体查询媒体查询是css3新语法@media可以针对不同的屏幕尺寸设置不同的样式1. 语法规范@media mediatype and|not|only(media feature) { CSS-Code;}用 @media开头mediatype 媒体类型关键字 and not onlymedia feature 媒体特性1.1 mediatype 查询类型
2021-11-24 15:28:34
279
原创 ES6 - let和const以及let和var的区别
文章目录一、let1. 语法2. let和var的区别**let和var在for循环的时候, 会有以下不同****如果把var改成let, 就会分别打印出 0,1,2,3,4****但是为什么把var改为let就会打印正常呢 ?**3. let和var的区别24. let不允许重复声明5. 暂时性死区二、const一、letES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。1. 语法{ let a = 10; var b =
2021-11-13 14:51:38
576
原创 移动端点击300ms延迟问题和解决 和 图片的懒加载 以及 css单位转化
文章目录一、使用fastclick二、图片的懒加载三、px2vw-css单位转化一、使用fastclick在main.js里面直接引入安装 : **npm install fastclick --save **导入 : import FastClick from 'fastclick'调用 : FastClick.attack(document.body)二、图片的懒加载图片需要显示到屏幕上的时候再加载安装 : npm install vue-lazyload --save导入 :
2021-11-03 15:52:18
102
原创 Better-Scroll框架的基本使用
文章目录一、BetterScroll 是什么？二、BetterScroll的使用三、BetterScroll的可选参数1. probeType2. click3. pullUpLoad四、实时监听BetterScroll滚动的位置五、BetterScroll可监听的事件!!! 这里出现一个错误六、上拉加载更多一、BetterScroll 是什么？BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件.二、BetterScroll的使用安装 : npm install
2021-10-08 10:58:41
928
原创 网络模块 - axios
文章目录一、axios框架的基本使用1.1 axios框架支持多种请求方式1.2 安装axios框架1.3 使用axios框架1.3.1 导入1.3.2 使用1.3.3 axios里面的参数1.4 获取axios框架请求的数据1.5 axios框架请求的url携带数据二、axios框架发送并发请求三、axios框架全局配置四、axios框架常见的配置选项一、axios框架的基本使用在浏览器中发送XMLHttpRequests请求在node.js中发送http请求支持Promise API1
2021-08-28 14:06:23
412
原创 Vue - Vuex - modules的使用详解和vuex-store文件夹的目录组织
文章目录一、为什么使用modules二、项目结构一、为什么使用modules当应用变得复杂时, store对象就有可能变得臃肿为了解决这个问题, Vuex允许我们将store分割成模块而每个模块拥有自己的state, mutations, actions, getters等二、项目结构...
2021-08-23 18:57:55
581
原创 Vue - Vuex - mutations和devtools
文章目录一、mutations介绍二、mutations的基本使用2.1 使用commit访问mutations里面定义的方法三、使用devtools插件监听mutaitons的操作一、mutations介绍通过mutations来修改状态相关的数据二、mutations的基本使用import Vue from 'vue'import Vuex from 'vuex'// 1. 安装插件Vue.use(Vuex)// 2. 创建对象const store = new Vuex.S
2021-08-22 16:19:11
561
原创 Vue - Vuex的概念和基本使用
文章目录一、Vuex是做什么的1.1 什么是状态管理1.2 管理什么状态二、Vuex的基本使用2.1 安装vuex2.2 创建一个store文件夹, 用来存放vuex2.3 配置vuex2.4 store里面放置的参数三、Vuex的里的参数3.1 state3.2 在组件里面使用state里面的数据四、修改Vuex的里的参数一、Vuex是做什么的Vuex是一个专门为Vue.js应用程序开发的状态管理模式1.1 什么是状态管理可以将其看成把需要多个组件共享的变量全部存储在一个对象里面然后
2021-08-22 15:14:33
251
3
原创 Vue - Promise
文章目录一、Promise是什么二、使用Promise三、Promise的简单使用四、Promise三种状态五、Promise的另外处理方式一、Promise是什么Promise是异步编程的一种解决方案二、使用Promise使用 new Promise() 创建 PromisePromise里面的参数是一个函数函数有两个参数, resolve 和 rejectresolve和reject本身又是函数.函数里面可以封装一些异步函数三、Promise的简单使用网络请
2021-08-22 12:11:34
436
原创 Vue - tabbar和路由结合效果
文章目录一、修改底部样式一、修改底部样式TabBarItem.vue<template> <div class="tab-bar-item"> <!-- 存放图片 --> <!-- 定义一个变量, 用来记录是否显示 --> <slot v-if="isActive" name="item-icon"></slot> <!-- 存放点击后改变样式的图片 -->
2021-08-21 17:39:39
458
原创 Vue - tabbar(底部导航栏)
文章目录一、TabBar实现思路二、assets文件夹2.1 在App.vue里面动态引用css文件三、基本搭建四、TabBar和TabBarItem组件封装4.1 TabBar组件封装4.2 TabBarItem组件封装一、TabBar实现思路定义一个TabBar组件TabBar中显示的内容由外界决定定义插槽二、assets文件夹assets文件夹里面存放的是一些css文件和img文件在assets文件夹里面创建一个base.css, 配置取消网页默认的padding和ma
2021-08-20 10:50:28
7173
原创 Vue - vue-router - keep-alive
文章目录一、keep-alive是什么一、keep-alive是什么keep-alive 是 Vue内置的一个组件, 可以使被包含的组件保留状态, 或避免重新渲染.router-view也是一个组件, 如果直接被包在keep-alive里面, 所有路径匹配到的视图组件都会被缓存....
2021-08-19 12:08:08
373
原创 Vue - vue-router - 导航守卫
文章目录一、需求二、方法一 : 使用生命周期函数二、方法二 : 监听全局跳转2.1 在路由里面添加源数据2.2 从from跳转到to三、导航守卫四、路由独享的守卫一、需求当点击到哪个模块的时候, 就把title修改为哪个模块的名字.二、方法一 : 使用生命周期函数created() : 当组件被创建的时候回调created函数mounted() : 当组件被挂载到DOM上的时候回调mounted函数updated() : 当页面发生更新的时候回调updated函数<templa
2021-08-18 15:41:37
157
原创 Vue - vue-router - 参数传递
文章目录一、query的类型1.1 对象里面的属性1.2 获取query里面的数据一、query的类型query对应的是一个对象. 对象中使用query的key作为传递方式.<template> <div id="app"> <router-link to="/home">首页</router-link> <router-link to="/about">关于</router-link> <
2021-08-18 12:44:57
379
原创 Vue - vue-router- 路由的懒加载和路由的嵌套
文章目录0、打包文件的解析一、路由的懒加载二、路由懒加载的方式三、路由的嵌套3.1 路由嵌套有两个步骤3.1.1 创建对应的子组件3.1.2 在父组件里面配置0、打包文件的解析打包后, 所有的路由文件都会被打包到一个 app.js 文件里, 导致app.js文件非常大, 会影响页面的加载速度一、路由的懒加载当打包构建应用时, Javascript包会变得非常大, 影响页面加载.我们希望把不同路由对应的组件分割成不同的代码块, 然后当路由被访问的时候才加载对应组件.路由懒加载的主要
2021-08-17 16:34:54
341
原创 Vue - vue-router动态路由
文章目录一、动态路由1.1 设置动态路由1.2 动态给路由绑定userid二、在User组件里面显示id信息2.1 `this.$route`2.2 `this.$route.params`一、动态路由在某些情况下, 一个页面的path路径可能是不确定的, 比如我们进入用户界面时, 除了前面的/user之外, 后面还跟上用户的ID : /user/aaa1.1 设置动态路由import VueRouter from 'vue-router'import Vue from 'vue'imp
2021-08-17 10:24:56
692
原创 Vue - Vue-Router路由的基本使用
文章目录一、vue-router的安装和配置方式二、配置vue-router2.1 index.js三、配置映射关系一、vue-router的安装和配置方式npm install vue-router --save二、配置vue-router1. 在src 里面创建router文件夹2. 创建index.js文件3. 在index.js文件里面配置vue-router2.1 index.js1. 导入VueRouter : import VueRouter import 'vue-ro
2021-08-15 11:09:57
303
原创 Vue - Vue-Router路由前瞻
文章目录一、什么是路由二、前端渲染和后端渲染2.1 单页面富应用一、什么是路由路由是通过互联的网络把信息从源地址传输到目的地址的活动路由提供了两种机制 : 路由和传送路由中有一个非常重要的概念叫路由表 , 路由表本质商家就是一个映射表, 决定了数据报的指向二、前端渲染和后端渲染后端渲染 : 利用后端语言, 如java将数据从数据库中读取出来, 并且将它动态的放在页面中前端渲染 : 浏览器中显示的网页中的大部分内容, 都是由前端写的js代码在浏览器中执行, 渲染出来的网页.
2021-08-11 14:44:51
82
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人