- 博客(20)
- 资源 (3)
- 收藏
- 关注
原创 webpack中加载器的基本使用
webpack中加载器的基本使用1.打包处理css文件运行npm i style-loder css-loader -D命令,安装处理css文件的loader在webpack.config.js的module->rules数组中,添加loader规则如下://所有第三方模块的匹配规则module:{ rules:{ test:/\.css$/,use:['style-loader','css-loader'] }}//test表示匹配的文件类型,use
2022-04-22 10:49:16
245
原创 webpack在项目中的基本使用
1.在项目中安装和配置webpack运行npm install webpack webpack-cli -D命令,安装webpack相关包在项目目录中,创建名为webpack.config.js的webpacck配置文件在webpack的配置文件中,初始化如下基本配置:module.exports = { mode: 'development', //production模式和development模式 }在package.json配置文件中的scripts节点下,新增dev脚本如下:
2022-04-20 16:52:32
1159
原创 Node.js中导入Mysql数据库模块
npm install Mysql包导入mysql模块,并与mysql建立连接//导入mysql模块const mysql = require('mysql')//建立与Mysql之间的连接关系const db = mysql.createPool({ host: '127.0.0.1', //数据库IP地址 user: 'root', //登录数据库的账号 password: 'admin123', //登录数据库的密码 database: 'my_db_01', //指定要操作的.
2022-04-19 11:31:09
1629
原创 解决Node.js中下包速度慢的问题
切换npm下包镜像源查看当前下包镜像源npm config get registry将下包镜像源切换为淘宝镜像源npm config set registry=https://registry.npm.taobao.reg/检查镜像源是否下载成功npm config get registrynrm使用为了更方便切换下包的镜像源,可以安装nrm这个工具,利用nrm提供的终端命令,可以快速的查看和切换下包的镜像源//1.通过npm包管理器,将nrm安装为全局可用的工具n
2022-04-16 15:43:25
1014
原创 node.js中模块化exports与module exports相关误区
require()模块时,得到的永远是module.exports指向的对象误区1//误区1exports.username = 'shang'module.exports = { gender: '男', age: '23'}得到结果为:{gender:'男',age:'23'}误区2module.exports.username = 'shang'exports = { gender: '男' age: '23'}得到结果为:{username:'shan
2022-04-15 18:13:25
200
原创 全局事件总线(GlobalEventBus)
全局事件总线(GlobalEventBus)1.—种组件间通信的方式,适用于任意组件间通信。2.安装全局事件总线:new Vue({...... beforeCreate() { Vue.prototype.$bus = this //安装全局事件总线,$bus就是当前应用的vm},......})3.使用事件总线:接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的回调留在A组件自身。methods(){ demo(data){......}}..
2022-01-15 16:03:51
203
原创 组件的自定义事件
1.一种自组件间通信的方式,适用于:子组件===>父组件⒉.使用场景:A是父组件,B是子组件,B想给A传数据,那么就要在A中给B绑定自定义事件(事件的回调在A中)。3.绑定自定义事件:第一种方式,在父组件中:<Demo @name="test"/>或<Demo v-on:name="test"/>第二种方式,在父组件中: <Demo ref="demo" / > ..... mounted(){ this.$refs
2022-01-14 16:27:05
202
原创 webStorage浏览器本地存储
webStorage浏览器本地存储1.存储内容大小一般支持5MB左右(不同浏览器可能还不一样)2.浏览器端通过Window.sessionStorage和Window.localStorage属性来实现本地存储机制。3.相关API:xxxxxStorage.setItem( ’ key ’ , 'value ’ );该方法接受一个键和值作为参数,会把键值对添加到存储中,如果键名存在,则更新其对应的值。2.xxxxxStorage.getItem( ’ person ’ );该方法接受一个键
2022-01-13 16:40:28
210
原创 Vue监视数据的原理
Vue监视数据的原理:vue 会监视data中所有层次的数据。如何监测对象中的数据?通过setter实现监视,且要在new Vue时就传入要监测的数据。(1).对象中后追加的属性,Vue默认不做响应式处理(2).如需给后添加的属性做响应式,请使用如下API: Vue.set (target, propertyName/index, value) 或 vm. $set( target, propertyName/index,value )如何监测数组中的数据?通过包裹数组更新元素的
2021-12-14 11:08:36
92
原创 Vue中的数据代理
Vue中的数据代理Vue中的数据代理:通过vm对象来代理data对象中属性的操作(读/写)Vue中数据代理的好处:更加方便的操作data中的数据基本原理:通过Object.defineProperty()把data对象中所有属性添加到vm上。为每一个添加到vm上的属性,都指定一个getter/setter。在getter/setter内部去操作(读/写)data中对应的属性。
2021-12-08 13:01:13
521
原创 JavaScript中的一些事件
文章目录事件的冒泡(Bubble)事件的委派事件的绑定事件的传播事件的冒泡(Bubble)所谓冒泡指的是事件向上传导,当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发,在开发中大部分情况冒泡都是有用的,如果不希望事件冒泡可以通过事件对象来取消冒泡代码解释:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>事件的冒泡</title> &l
2021-11-29 19:32:30
254
原创 什么是 DOM
文章目录什么是 DOM什么是 HTML DOM?HTML——DOM节点DOM 节点HTML DOM 节点树HTML DOM Tree 实例节点父、子和同胞HTML节点演示片段:HTML DOM 方法编程接口HTML DOM 对象 - 方法和属性现实生活中的对象一些 DOM 对象方法什么是 DOMDOM 是 W3C(万维网联盟)的标准。DOM 定义了访问 HTML 和 XML 文档的标准:“W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样
2021-11-22 21:22:41
1185
原创 Javascript知识点
Javascript基础知识点1.在js中一共有六种数据类型StringNumberBooleanNullUndefinedObject字符串数值布尔值空值未定义对象其中string,number,boolean,null,undefined为基本数据类型,而object的呼吁引用数据类型2.将其他类型数据转换为 String1. 方法一调用被转换数据类型的toString()方法 ,该方法不会影响到原变量,他会将转换的 结果返回,但是注意:null和
2021-11-17 16:08:04
574
原创 定位(position)
定位(position)定位是一种更加高级的布局手段,通过定位可以将元素摆放到页面的任意位置,使用position属性来设置定位可选值:staticrelativeabsolutefixedsticky默认值,元素静止没有开启定位开启元素相对定位开启元素绝对定位开启元素固定定位开启元素的粘滞定位相对定位当元素的position属性值为relative时则开启了元素的相对定位相对定位的特点:开启相对定位后,如果不设置偏移量元素不会发生任何变化;相对
2021-10-27 17:31:54
113
原创 高度塌陷问题和BFC
高度塌陷问题和BFC高度塌陷问题在浮动布局中,父元素的高度默认是被子元素撑开的,当子元素浮动后,其会完全脱离文档流,子元素从文档流中脱离将会无法撑起父元素的高度,导致父元素的高度丢失,而父元素高度丢失后,其下的元素会自动上移,导致页面的布局混乱,所以高度塌陷问题是浮动布局中比较常见的一个问题。(表现问题,并非结构问题)FBC(Block Formatting Context)块级格式化环境BFC是CSS中一个隐含的属性,开启BFC的该元素会变成一个独立布局区域元素开启BFC后的特点
2021-10-26 18:01:53
90
原创 盒模型、盒子模型、框模型(box model)
盒模型、盒子模型、框模型(box model)——css将页面中的所有元素都设置为一个矩形的盒子——将元素设置为矩形的盒子后,对页面的布局就变成了将不同的盒子摆放到 不同的位置——每一个盒子都由以下及部分组成:内容区(content)、内边距(padding)、边框(border)、外边距(margin)边框(border)边框属于盒子边缘,边框里边属于盒子内部,出了边框都是盒子的外部,边框的大小影响到整个盒子的大小设置边框的三个样式:宽度(border-width)、颜色(border
2021-10-24 15:46:26
2925
原创 html&css课堂笔记
html&css知识点1.标签a标签<a href="http://baidu.com" target="_black">这是超链接标签</a><a href="http://baidu.com" target="_black">这是超链接标签</a><!-- target属性,用来指定超链接打开的位置 可选值:_self 默认值 在当前页面打开超链接 _black在一个新页面打开超链接 --&g
2021-10-23 12:01:26
73
原创 HTML5&CSS
1.HTML5&CSS入门简介:1.HTML5:HTML5 技术结合了 HTML4.01 的相关标准并革新,符合现代网络发展要求,在 2008 年正式发布。HTML5 由不同的技术构成,其在互联网中得到了非常广泛的应用,提供更多增强网络应用的标准机。与传统的技术相比,HTML5 的语法特征更加明显,并且结合了 SVG 的内容。这些内容在网页中使用可以更加便捷地处理多媒体内容,而且 HTML5中还结合了其他元素,对原有的功能进行调整和修改,进行标准化工作。HTML5 在 2012 年已形成了稳
2021-10-16 10:55:53
89
node.js时钟案例
2022-04-13
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人