<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[aa_mmnn的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/aa_mmnn</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; aa_mmnn]]></copyright><item><title><![CDATA[CSS布局之网格布局]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/132148760</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/132148760</guid><author>aa_mmnn</author><pubDate>Mon, 07 Aug 2023 16:15:15 +0800</pubDate><description><![CDATA[网格布局也称grid布局，利用grid布局可以很轻松的实现很多的网页布局，Grid 布局与 Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，它们也存在重大区别。Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局。Grid 布局远比 Flex 布局强大。上图这样的布局，就是 Grid 布局的拿手好戏。]]></description><category></category></item><item><title><![CDATA[数组的reduce方法]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/126785426</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/126785426</guid><author>aa_mmnn</author><pubDate>Fri, 09 Sep 2022 16:37:20 +0800</pubDate><description><![CDATA[打印结果可以看到， reduce 就是对 arr 从左到右进行累加求和， 如果没有传入函数迭代的初始值， 初始值默认是数组第一位 ， prev 就是计算结束后的返回值。除了平时我们可以用它去求一个数组的和，又或者是乘积，我们还可以拿他去做很多很多的事情，比如 计算数组中每个元素出现的次数，数组去重，扁平数组等等。打印结果可以看到，我们传入函数迭代的初始值之后，也就是让 prev 从10开始累加，然后接着迭代累加 prev。要执行的函数，要执行的函数中也可以传入参数，如下。arr：被遍历的数组。]]></description><category></category></item><item><title><![CDATA[getBoundingClientRect() 与 offset]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/126283836</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/126283836</guid><author>aa_mmnn</author><pubDate>Thu, 11 Aug 2022 13:49:19 +0800</pubDate><description><![CDATA[offset 的方向值需要考虑到父级，如果父级是定位元素，那么子元素的offset值相对于父元素，如果父元素不是定位元素，那么子元素的offset值相对于 可视区窗口。原文链接：https://blog.youkuaiyun.com/itSeven7/article/details/78855223。Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。right 方向的值是基于 元素右侧边框到可视区左边的距离。bottom方向的值是基于 元素底部到可视区顶部的距离。..]]></description><category></category></item><item><title><![CDATA[2022年了，这些ES7-ES12的知识点你都掌握了嘛？]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/122798718</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/122798718</guid><author>aa_mmnn</author><pubDate>Sun, 06 Feb 2022 15:41:32 +0800</pubDate><description><![CDATA[前言

听说现在大家在工作中ES6语法都已经用的炉火纯青了，那ES7-ES12的新特性你现在都用上了嘛？很多的新特性在开发中还是很实用的，也解决了很多js存在的问题。自己熬夜爆肝一个周末,总结出了ES7-ES12的语法，希望对你能有一定的帮助。最后，了解真相，你才能获得真正的自由！

ES2016(ES7)

Array.prototype.includes()

includes()方法用来判断一个数组是否包含一个指定的值，如果包含则返回true，否则返回false。

语法


arr.inclu...]]></description><category></category></item><item><title><![CDATA[Vue事件总线（EventBus）使用详细介绍]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/121075988</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/121075988</guid><author>aa_mmnn</author><pubDate>Mon, 01 Nov 2021 10:49:24 +0800</pubDate><description><![CDATA[前言

vue组件非常常见的有父子组件通信，兄弟组件通信。而父子组件通信就很简单，父组件会通过props向下传数据给子组件，当子组件有事情要告诉父组件时会通过$emit事件告诉父组件。今天就来说说如果两个页面没有任何引入和被引入关系，该如何通信了？



如果咱们的应用程序不需要类似Vuex这样的库来处理组件之间的数据通信，就可以考虑Vue中的事件总线，即 **EventBus**来通信。

EventBus的简介

EventBus又称为事件总线。在Vue中可以使用EventBus来作为...]]></description><category></category></item><item><title><![CDATA[html最多显示两行,css 实现两行或多行文本溢出显示省略号（...）]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/120766463</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/120766463</guid><author>aa_mmnn</author><pubDate>Thu, 14 Oct 2021 16:13:03 +0800</pubDate><description><![CDATA[1. 大家都知道，强制一行溢出显示省略号(...)的情况很简单

overflow:hidden;//超出的隐藏

text-overflow:ellipsis;//显示省略符号来代表被修剪的文本。

white-space:nowrap;//不换行

2. 但是如果要强制两行甚至多行的话，需要用到css3的知识点

网上大多版本都是：

overflow: hidden; // 超出的文本隐藏

text-overflow: ellipsis; // 溢出用省略号显示

display: -webkit-]]></description><category></category></item><item><title><![CDATA[循环调用异步操作]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/120717289</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/120717289</guid><author>aa_mmnn</author><pubDate>Tue, 12 Oct 2021 09:44:07 +0800</pubDate><description><![CDATA[最近遇到一道比较有趣的面试题，题目很简单但是涉及到了很多小的知识点，还蛮有意思的。

一个普通的for循环输出i


// 正常写一个for循环输出i
for (var i = 0; i &lt; 5; i++) {
    console.log(i);
}
console.log(i);


假设你是一个面试者，你说说这几行代码会输出什么？，你的内心活动会不会是“这特么不就是一个循环吗？面试官既然这么问老子（他还笑肯定不是好东西，肯定有陷阱），好好想一下，这好像和我看的那个闭包的题很像啊，这面试官是..]]></description><category></category></item><item><title><![CDATA[详解CSS3中:nth-child的用法]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/120217177</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/120217177</guid><author>aa_mmnn</author><pubDate>Fri, 10 Sep 2021 11:15:34 +0800</pubDate><description><![CDATA[CSS3中:nth-child的实际用途：不适用低版本的IE浏览器！

（1）:nth-child(n + 4)选取大于等于4的标签，其中"n"为整数，下同




.demo01 li:nth-child(n+4){background:#090}








（2）:nth-child(-n + 4)选取小于等于4的标签




.demo01 li:nth-child(-n+4){background:#090}









（3）:nth-child(2n)选取偶数标签，其中的2n也可以写]]></description><category></category></item><item><title><![CDATA[mock.js的使用方法]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/118494174</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/118494174</guid><author>aa_mmnn</author><pubDate>Mon, 05 Jul 2021 17:07:06 +0800</pubDate><description><![CDATA[在开发过程中，有很多的ajax请求，前后端分离开发你肯定遇到这样的问题，后台给你的接口文档，你需要在本地模拟数据返回，可能你也用到过我之前用的蠢方法，就是新建一个test.json文件，放入接口文档中写的返回示例，这么做有个很大的问题是不够灵活，而且还需要切换url，现在学会使用mock.js拦截ajax请求，更加方便的构造你需要的假数据。

一.简单示例

在这里我举的例子是在vue项目中如何使用mock.js。

安装mockjsnpm install mockjs --save-dev
	在项目中创建]]></description><category></category></item><item><title><![CDATA[2021-06-15css弹性盒子-------桃园三兄弟之：flex-grow、flex-shrink、flex-basis详解]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117923173</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117923173</guid><author>aa_mmnn</author><pubDate>Tue, 15 Jun 2021 14:01:05 +0800</pubDate><description><![CDATA[flex-grow、flex-shrink、flex-basis三个属性的作用：

在flex布局中，父元素在不同宽度下，子元素是如何分配父元素空间的。

(注意：这三个属性都是在子元素上设置的，下面小编要讲的是父元素，指以flex布局的元素(display:flex))

小编这里先教一下大家如何快速记住这三个属性：

首先是flex-basis，basis英文意思是&lt;主要成分&gt;，所以他和width放在一起时,肯定把width干掉，basis遇到width时就会说我才是最主要的成分，...]]></description><category></category></item><item><title><![CDATA[解决ElementUI的Table组件固定列，在屏幕刚好够表格显示时，会出现固定列显示不全的问题]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117356441</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117356441</guid><author>aa_mmnn</author><pubDate>Fri, 28 May 2021 11:14:32 +0800</pubDate><description><![CDATA[在使用ElementUI的Table组件中的固定列时，发现当表格刚好显示全，处于临界值状态时，固定列的高度(height)会于表格高度不一致，导致固定列显示不全，出现垂直滚动条。


如上图所示，现在表格下方是未出现水平滚动条的，处于表格宽度刚好够显示所有字段的临界值，固定列出现了高度变小的情况，导致显示不全。

上图为检查元素找到的固定列的DOM元素，固定列的DOM元素是独立于表格body的，所有在开发代码中，给该列设置任何class或style是无法添加在固定列这个DOM元素上的。从这个DOM元素可以看]]></description><category></category></item><item><title><![CDATA[Element UI VUE table表头与数据错位问题解决方案]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117355664</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117355664</guid><author>aa_mmnn</author><pubDate>Fri, 28 May 2021 11:01:49 +0800</pubDate><description><![CDATA[问题分析：个人在做项目时，屏幕的大小以及滚动条（横向滚动条，竖向滚动条）的出现会导致标题描述的问题，经过查阅资料做出如下解决方案，供各位同仁参考



1、CSS样式解决横向滚动条出现时错位问题请在Element-UI的 scss 文件中添加

.el-table th.gutter{
display: table-cell!important;
}
2、竖向滚动条出现时，出现错位请在 绑定数据后添加如下代码

this.$nextTick(()=&gt;{
t...]]></description><category></category></item><item><title><![CDATA[git restore 和 git restore --staged 的区别]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117248486</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117248486</guid><author>aa_mmnn</author><pubDate>Tue, 25 May 2021 09:20:12 +0800</pubDate><description><![CDATA[git restore
git restore &lt;file&gt;
表示将在工作空间但是不在暂存区的文件撤销更改
示例：


E:\JavaDev\template_workspace\zhw-free&gt;git status            
On branch master                             
Your branch is up to date with 'origi...]]></description><category></category></item><item><title><![CDATA[e.preventDefault()与e.stopPropagation()的区别]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117129378</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117129378</guid><author>aa_mmnn</author><pubDate>Fri, 21 May 2021 17:28:26 +0800</pubDate><description><![CDATA[e.stopPropagation()阻止事件冒泡
&lt;table border='1'&gt;
  &lt;tr&gt;
    &lt;td&gt;&lt;span&gt;冒泡事件测试&lt;/span&gt;&lt;/td&gt;
    &lt;td&gt;&lt;span&gt;冒泡事件测试2&lt;/span&gt;&lt;/td&gt;
  &lt;/tr&gt;
&lt;/table&gt;
我们先看这段js代码：

&lt;script&gt;
 $('ta...]]></description><category></category></item><item><title><![CDATA[vue-cli项目中.postcssrc.js]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117077933</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117077933</guid><author>aa_mmnn</author><pubDate>Thu, 20 May 2021 15:18:22 +0800</pubDate><description><![CDATA[module.exports = {
 "plugins": {
  "postcss-import": {},   //用于@import导入css文件
  "postcss-url": {},      //路径引入css文件或node_modules文件
  "postcss-aspect-ratio-mini": {},  //用来处理元素容器宽高比
  "postcss-write-svg": { utf8: false },  //用来处理移动端1px的解...]]></description><category></category></item><item><title><![CDATA[typeof与instanceof区别]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/117036723</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/117036723</guid><author>aa_mmnn</author><pubDate>Wed, 19 May 2021 17:09:01 +0800</pubDate><description><![CDATA[typeof

用于判断数据类型，返回值为6个字符串，分别为string、Boolean、number、function、object、undefined。




  var a = [34,4,3,54],
        b = 34,
        c = 'adsfas',
        d = function(){console.log('我是函数')},
        e = true,
        f = null,
        g;

        console.lo.]]></description><category></category></item><item><title><![CDATA[git拉取远程分支并创建本地分支]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/116994017</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/116994017</guid><author>aa_mmnn</author><pubDate>Tue, 18 May 2021 16:27:20 +0800</pubDate><description><![CDATA[一、查看远程分支

使用如下git命令查看所有远程分支：

git branch -r

查看远程和本地所有分支：git branch -a

查看本地分支：git branch
在输出结果中，前面带*的是当前分支。

二、拉取远程分支并创建本地分支

方法一

使用如下命令：

git checkout -b 本地分支名x origin/远程分支名x

使用该方式会在本地新建分支x，并自动切换到该本地分支x。

采用此种方法建立的本地分支会和远程分支建立映射关系。

方式二

使用如下命令：

g...]]></description><category></category></item><item><title><![CDATA[npm 使用注意]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/116975042</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/116975042</guid><author>aa_mmnn</author><pubDate>Tue, 18 May 2021 09:08:49 +0800</pubDate><description><![CDATA[2.6.1 npm init

使用 npm init 初始化一个空项目是一个好的习惯，即使你对 package.json 及其他属性非常熟悉，npm init 也是你开始写新的 Node.js 应用或模块的一个快捷的办法。npm init 有智能的默认选项，比如从根目录名称推断模块名称，通过 ~/.npmrc 读取你的信息，用你的 Git 设置来确定 repository 等等。

2.6.2 npm install

npm install 是我们最常用的 npm 命令之一，因此我们需要好好了解下这个命]]></description><category></category></item><item><title><![CDATA[windows下nvm安装node之后npm命令找不到问题解决办法]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/116696806</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/116696806</guid><author>aa_mmnn</author><pubDate>Wed, 12 May 2021 10:01:53 +0800</pubDate><description><![CDATA[主要关键解解决办法：===》》适用于所有东西的安装

安装有关环境配置类的软件及其他，一般情况下切记不要安装到c盘programfiles下，否则会出现各种问题的报错！！！切记！

nvm安装步骤：

1、下载nvm-setup安装包

2、打开安装包，选择nvm的存放路径，以及nodejs的存放路径，这里切记不要选择到c:/program files,这里的两个路径是为了自动在系统中添加环境变量的路径；

3、打开nvm文件夹下的settings.txt文件，在最后添加以下代码：




node_mi.]]></description><category></category></item><item><title><![CDATA[Windows下完全卸载node.js并安装node.js的多版本管理工具nvm-windows]]></title><link>https://blog.youkuaiyun.com/aa_mmnn/article/details/116696247</link><guid>https://blog.youkuaiyun.com/aa_mmnn/article/details/116696247</guid><author>aa_mmnn</author><pubDate>Wed, 12 May 2021 09:53:37 +0800</pubDate><description><![CDATA[前言
由于高版本的node.js导致gulp执行build命令失败，我需要在Windows下卸载掉已有的node.js并安装一个多版本管理工具nvm-windows，方便切换不同版本的node.js。

nvm是Linux下常用的一个node.js多版本管理工具，但是nvm不能在Windows下使用，在GitHub上有个项目叫nvm-windows，可以让我们在Windows下对node.js进行多版本管理。

nvm-windows的下载地址：https://github.com/coreybutler/]]></description><category></category></item></channel></rss>