- 博客(32)
- 收藏
- 关注
RSS订阅
原创 vue简版源码解析以及简版的实现
vue的设计思想(MVVM模式)MVVM框架的三要素包括: 数据响应式 模板引擎及其渲染数据响应式: 监听数据变化并在视图中更新Object.defineProperty() ---- vue2中采用的数据劫持,数据拦截的策略Proxy — vue3中采用的是代理模式模板引擎: 提供描述视图的模板语法插值: {{}}指令: v–on, v-bind, v-model, v-for, v-if 等等渲染: 如何将模板转换成为html模板 => vdom => dom数据
2021-04-04 20:06:03
425
1
原创 vue全家桶(vuex简版源码的实现)
VuexVuex 集中式存储管理应⽤的所有组件的状态，并以相应的规则保证状态以可预测的⽅式发⽣变化。下面是Vuex工作的流程图安装： vue add vuexvue add vuex核⼼概念State 状态,数据Actions 异步操作Mutations 更改状态的函数store 包含以上概念的容器状态 -statestate用来存储状态export default new Vuex.Store({ state: { count: 0 },})状态
2020-12-13 21:21:43
213
原创 vue全家桶(vue-router简版源码的实现)
vue-routerVue Router 是 Vue.js 官⽅的路由管理器。它和 Vue.js 的核⼼深度集成，让构建单页面应用变得易如反掌。嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于 Vue.js 过渡系统的视图过渡效果细粒度的导航控制带有自动激活的 CSS class 的链接HTML5 历史模式或 hash 模式，在 IE9 中自动降级自定义的滚动条行为安装： vue add router核⼼步骤：步骤⼀：使⽤vue-router插件，rout
2020-11-08 20:38:45
1990
7
原创 uni.createInnerAudioContext() 小程序android机拿到的时长为0
uni.createInnerAudioContext() 打包成小程序，Android机获取duration为0
2022-06-01 16:47:03
1035
原创 使用Docker安装Jenkins（docker的基本使用）
Docker介绍Docker是一种容器技术容器是什么-容器是一种轻量级，可移植，自包含的软件打包技术，是应用程序可以在几乎任何地方以相同的方式运行开发在自己笔记本上创建并测试好容器，无需任何修改就能够生产系统的虚拟机，物理服务器或公有云主机（阿里云）上运行Docker由来容器来源于集装箱，二者的英文都是Container,集装箱解决了运输的难题Docker的中文意思是码头工人Docker的图标是集装箱容器VS虚拟机虚拟机： 在一台物理主机上虚拟一个操作系统，实际上比较重，多台虚拟机
2021-11-23 22:02:40
936
原创 前端常用的设计模式
设计原则SOLID(稳定的)单一职责原则（Single Responsibility Principle）一个类应该只有一个发生变化的原因。简而言之就是每个类只需要负责自己的那部分，类的复杂度就会降低。开闭原则（Open Closed Principle）一个软件实体，如类、模块和函数应该对扩展开放，对修改关闭里氏替换原则（Liskov Substitution Principle）所有引用基类的地方必须能透明地使用其子类的对象，也就是说子类对象可以替换其父类对象，而程序执行效
2021-08-07 18:03:33
89
原创 nrm常用命令
nrm是什么nrm(npm registry manager )是npm的镜像源管理工具，有时候国外资源太慢，使用这个就可以快速地在 npm 源间切换安装在终端中执行npm install -g nrm,全局安装常用命令查看可选源: nrm ls查看当前源: nrm current测试源响应时间: nrm test taobao切换源: nrm use taobao增加定制源: nrm add imooc http://192.168.1.100.6666删除源: nrm del im
2021-05-29 15:54:53
288
原创 vue源码解析(中)异步更新与虚拟dom
异步更新队列Vue⾼效的秘诀是⼀套批量、异步的更新策略。概念解释事件循环Event Loop：浏览器为了协调事件处理、脚本执⾏、⽹络请求和渲染等任务⽽制定的⼯作机制。微任务：微任务是更⼩的任务，是在当前宏任务执⾏结束后⽴即执⾏的任务。** 如果存在微任务，浏览器会清空微任务之后再重新渲染。**微任务的例⼦有 Promise 回调函数、DOM变化等。...
2021-04-19 22:16:52
365
5
原创 vue项目中src引入相对路径的图片不显示问题
如下所示：<template> <img :src="img" alt=""></template>export default { data () { img: './logo.png' }}这样动态引入图片，在页面会显示不出, 在这里有两种方法可以解决，造成这种现象的原因，我最后会说明解决方法第一种：直接 import 导入图片<template> <img :src="img" alt=""><
2021-02-22 14:09:50
3516
原创 nvm的一些常用命令
1. 安装nodenvm install <node的版本>2.查看安装的nodenvm ls// 或者nvm list3. 使用安装的nodenvm use <node的版本>4. 删除已经安装的nodenvm uninstall <node的版本>5.安装最新版 node（稳定版本）nvm install stable6.设置默认指定版本nvm alias default <node版本号>...
2020-11-25 15:07:56
279
原创 Mac电脑flutter安装成功了但是仍然提示flutter command not found
官方文档明确说明需要更新环境变量(明确来说就是需要配置全局的环境变量)您在命令行只能更新当前会话的PATH变量，如Clone Flutter repo所示。 但是，您可能需要的是永久更新此变量，以便您可以运行flutter命令在任何终端会话中。对于所有终端会话永久修改此变量的步骤是和特定计算机系统相关的。通常，您会在打开新窗口时将设置环境变量的命令添加到执行的文件中打开命令行工具 输入vim ./.bash_profile// 或者sudo vi ~/.bash_profile然后编辑
2020-11-23 21:52:12
4617
5
原创 react的生命周期
React 中的生命周期简介: 生命周期函数指在某一个时刻组件会自动调用执行的函数一个组件会经历如下图的几个过程 , 先配一张图Initialization: 这个时候组件会初始化一些数据(setup props and state)Mounting: 组件要被渲染,并挂载到页面, 而挂载会经历几个周期componentWillMount: 在组件即将被挂载到页面之前的时刻自动执行render: 将组件的内容渲染到页面上componentDidMount: 组件被挂载到页面之后自动执行(
2020-11-22 20:23:39
105
原创 Mac和Window终端设置代理
Mac终端设置代理// 配置http访问的export https_proxy=http://127.0.0.1:7890// 配置https访问的http_proxy=http://127.0.0.1:7890// 配置http和https访问all_proxy=socks5://127.0.0.1:7891window终端设置代理set http_proxy=http://127.0.0.1:1080set https_proxy=http://127.0.0.1:1080git
2020-11-19 18:40:58
566
原创 初次将项目推到github的命令
将项目推到gitHub之前，你得先有个github，注册方法我这里就不赘述了，github官网传送门第一次将项目推送到githubgit init // 初始化gitgit add . // 将工作区文件添加到暂存区git commit -m "first commit" // 将暂存区里的改动给提交到本地的版本库git remote add origin https://github.com/xxxxxx/File-processing.git // 关联远程仓库，每个人的都不一样..
2020-10-22 18:46:52
271
原创 Vue使用require.context()实现组件和路由导入
一般情况下在vue项目中我们引入组件都会使用如下方式：import导入的方式这样写，写了很多的重复代码，此时可以利用require.context()代码如下：const path = require('path')const files = require.context('./components/H5Campaign', false, /\.vue$/)const modules = {}console.log(files.keys())files.keys().forEach(.
2020-07-15 16:59:44
1598
3
原创 vue自定义插件与使用
1.vue自定义插件的作用插件通常是用来为Vue添加全局功能。插件的范围没有严格的限制。——一般有下面几种：添加全局方法或者 property。如：vue-custom-element添加全局资源：指令/过滤器/过渡等。如 vue-touch通过全局混入来添加一些组件选项。如 vue-router添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如 vue-router这一段是vue官方文档上的原话
2020-06-12 18:19:03
1115
原创 git commit 忽略绕过Eslint校验
git commit 忽略Eslint校验一句代码git commit --no-verify -m "提交" //可以跳过代码检查
2019-12-12 18:54:56
6963
原创 css属性书写的先后顺序与命名规则
书写css的时候是有先后顺序的，可以增强代码的阅读体验。下面是我做出的一些总结：1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(...
2019-11-24 15:55:25
730
原创 Error in v-on handler: "SyntaxError: Failed to set the 'href' property on 'Location':解决方案
这个问题出现在使用window.location.href情况下，直接上代码吧window.location.href = '192.168.10.19:8082/microProject/connector/7f9b3ba4dc77092d/adminSetup/whiteList'上面这个代码直接报错 如下图：解决方法：window.location.href = 'http://...
2019-09-05 17:40:34
12274
1
原创 git 撤销代码
git如何撤销和回滚由于也是刚接触git版本管理工具不久，对git使用不熟练，在项目开发中也是磕磕碰碰，于是决定好好熟悉一下git版本管理工具，其中git的撤销和回滚在项目当中还是应用的比较多因此做了一下总结，列出常见的撤销命令。1 git commit 之前撤销命令下图是我未添加到暂存区的文件(也就是没有执行git add这个命令)这种撤销可以直接执行git checkout -......
2019-09-05 17:30:36
1195
6
原创 ES6常用知识点
ES6基础 {ignore=true}文章目录ES6基础 {ignore=true}ECMAScript概述ES6核心内容常量let关键字箭头函数默认参数对象代理解构：更方便的数据访问异步ECMAScript概述1. 什么是ESECMAScript（简称ES）是一种由Ecma国际（前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Asso...
2019-04-02 12:09:29
348
原创 webpack指南
webpack指南 {ignore=true}文章目录webpack指南 {ignore=true}webpack概述浏览器环境中的困境前端构建工具webpackwebpack安装体验webpack打包使用mode配置入口和出口使用babel获得最大的兼容性babel加载器babel插件 pluginbabel预设 presetbabel-runtime生成页面清理dist文件夹样式处理css加...
2019-04-02 11:55:53
795
原创 移动端解决1像素边框问题
为什么1像素边框变粗了为什么移动端CSS里面写了1px，实际上看起来比1px粗；了解设备物理像素和逻辑像素的同 学应该很容易理解，其实这两个px的含义其实是不一样的，UI设计师要求的1px是指设备的物理像素1px，而CSS里记录的像素是逻辑像素，它们之间存在一个比例关系，可以用javascript中的window.devicePixelRatio来获取，也可以用媒体查询的-webkit...
2019-03-29 10:49:01
361
原创 面试题使用js去除字符串中的前后空格
面试题使用js去除字符串中的前后空格1.去除左空格 function leftTrim(str){ return str.replace(/(^\s*)/g,"")}2.去除右空格function rightTrim(str){ return str.replace(/(\s*$)/g,"")}3.去除左右空格function trim(str){ ret...
2019-03-29 10:38:10
256
原创 vs code 打开顶部菜单栏和左侧菜单栏
vs code 顶部菜单栏和左侧菜单栏如何打开顶部菜单栏按快捷键 F1 或者 shift+ctrl+p 切换出命令行，然后输入menu 有个view:toggle Menu bar 的功能，即可打开顶部菜单栏如何打开左侧工具栏在顶部菜单栏上点击查看 >外观> 显示状态栏...
2019-03-25 08:23:17
27460
18
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人