<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[让世界更美好！]]></title><description><![CDATA[猝然临之而不惊，无故加之而不怒]]></description><link>https://blog.youkuaiyun.com/Helloyongwei</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Helloyongwei]]></copyright><item><title><![CDATA[css实现“加号”效果]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/83242871</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/83242871</guid><author>Helloyongwei</author><pubDate>Sun, 21 Oct 2018 16:53:11 +0800</pubDate><description><![CDATA[实现下图的加号效果：

若想实现这个效果， 只需一个div元素即可搞定。
需要用到css的为了before和after， 以及border特性。
先设置一个div便签
 &amp;amp;lt;div class=&amp;quot;add&amp;quot;&amp;amp;gt;&amp;amp;lt;/div&amp;amp;gt;

再设置一个边框：
.add {
  border: 1px solid;
  width: 100px;
  height: 100px;
  ]]></description><category></category></item><item><title><![CDATA[开始学习React—概述与演练（好文翻译）]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/83020389</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/83020389</guid><author>Helloyongwei</author><pubDate>Thu, 11 Oct 2018 23:09:59 +0800</pubDate><description><![CDATA[这篇文章来自于Getting started with React
React基本概念的概览与演示, 如components, state和props, 以及提交表单, 从API获取数据或者部署React 应用到生产环境.
自动我第一次学习JavaScript时就已经听说了React, 但是我要承认我看了它一眼就被它吓到了. 我看到它像混合着JavaScript的HTML, 这不是我们正要避免的吗...]]></description><category></category></item><item><title><![CDATA[redux的数据流]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82937808</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82937808</guid><author>Helloyongwei</author><pubDate>Fri, 05 Oct 2018 21:21:26 +0800</pubDate><description><![CDATA[redux是数据

]]></description><category></category></item><item><title><![CDATA[script中的defer和async]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82756705</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82756705</guid><author>Helloyongwei</author><pubDate>Tue, 18 Sep 2018 14:03:06 +0800</pubDate><description><![CDATA[script的使用方式
在html页面中使用JavaScript的主要方法便是使用script标签. 它有两种使用方式. 第一种便是用src属性引用外部文件. 第二种是将JavaScript代码嵌套在script标签中. 如:
&amp;amp;amp;amp;lt;!-- 第一种--&amp;amp;amp;amp;gt;
&amp;amp;amp;amp;lt;script src=&amp;amp;amp;quot;http://www.example.com/xxx.js&amp;amp;am]]></description><category></category></item><item><title><![CDATA[css清除浮动]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82596399</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82596399</guid><author>Helloyongwei</author><pubDate>Mon, 10 Sep 2018 21:27:39 +0800</pubDate><description><![CDATA[清除浮动

清除浮动的方法在网络上有许多文章总结了. 我为了加深记忆, 就写一篇吧. 
我最喜欢的清除浮动方法是, 使用.clearfix



&amp;lt;div class=&quot;father clearfix&quot;&amp;gt;
    &amp;lt;div class=&quot;left&quot;&amp;gt;child1&amp;lt;/div&amp;gt;
    &amp;lt;div class=&quot;right&quot;&amp;gt;child2&am]]></description><category></category></item><item><title><![CDATA[css选择器的优先级]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82587426</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82587426</guid><author>Helloyongwei</author><pubDate>Mon, 10 Sep 2018 11:50:51 +0800</pubDate><description><![CDATA[四个等级

css选择器的优先级规定了文档采用哪一种样式.  
选择器的等级主要有以下四个等级(依次递减)


行内样式(style声明)
id选择器
类, 伪类, 属性选择器
元素选择器, 伪元素选择器


当同一个元素有多个css规则时, 对照着上面的四个等级, 对每一个规则确定每个等级有几个选择器, 记下个数. 然后做下列运算. 
行内样式的选择器个数乘以1000 
id选择器的个数乘以10...]]></description><category></category></item><item><title><![CDATA[CSS居中全攻略]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82586182</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82586182</guid><author>Helloyongwei</author><pubDate>Mon, 10 Sep 2018 10:59:22 +0800</pubDate><description><![CDATA[水平居中



内联元素

css的水平居中相对于垂直居中比较好些. 当要居中的元素是一个内联元素时, 只需要在其父元素上加上下面的一条css规则即可:

text-align: center;

块级元素

要居中的是一个块级元素, 那么设置元素的左右外边距为zuto即可. 即下面的规则:



margin-left: auto;
margin-right: auto;

多个块级元素

多个...]]></description><category></category></item><item><title><![CDATA[meta viewport是干啥用的]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82585673</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82585673</guid><author>Helloyongwei</author><pubDate>Mon, 10 Sep 2018 10:09:19 +0800</pubDate><description><![CDATA[meta初探

在每个html页面的header部分常常会看见一个meta标签. 这个标签中最常写的就是下面的内容:

 &amp;amp;lt;meta name=&amp;quot;viewport&amp;quot; content=&amp;quot;width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0&amp;quot;&amp;amp;gt;

这个标签内...]]></description><category></category></item><item><title><![CDATA[HTML语义化]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82585084</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82585084</guid><author>Helloyongwei</author><pubDate>Mon, 10 Sep 2018 09:27:51 +0800</pubDate><description><![CDATA[什么事HTML语义化

html语义化就是根据标签, 我就知道标签内的是啥内容. 比如: aside标签表示一个侧边栏, header标签表示头部, 而footer标签表示尾部. 这就是html语义化. 语义话可以更好的让我们理解文档内容.  
一篇文档会根据内容区分结构, 这些结构我们就可以了赋予不同的标签, 比如header, footer, main, section, article等. ...]]></description><category></category></item><item><title><![CDATA[vue中组件通信(父子组件, 爷孙组件, 兄弟组件)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82384551</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82384551</guid><author>Helloyongwei</author><pubDate>Tue, 04 Sep 2018 16:38:06 +0800</pubDate><description><![CDATA[vue中我们常常用到组件. 那么组件总体可以分为如下的几种关系.  
父子组件, 爷孙组件, 兄弟组件. 这几种组件之间是如何通信的呢? 

父子组件通信

根据vue中的文档可知, 组件的props属性用于接收父组件传递的信息. 而子组件想要向父组件传递信息, 可以使用$emit事件.  
我们定义两个组件, 一个为父组件名为father, 另外一个为子组件child. 子组件通过props属性...]]></description><category></category></item><item><title><![CDATA[如何写js中的继承]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82250486</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82250486</guid><author>Helloyongwei</author><pubDate>Fri, 31 Aug 2018 07:57:01 +0800</pubDate><description><![CDATA[原型继承

js中有原型的概念, 通过原型我们可以实现继承. 
定义一个函数为animal, 在其原型上定义一个sayHello函数. 并生成一个新对象dog.

function Animal(name){
    this.name = name
}
Animal.prototype.sayHello = function() {
    console.log('hello')

}
var...]]></description><category></category></item><item><title><![CDATA[Linux中文件和目录的权限(r, w, x)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82193667</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82193667</guid><author>Helloyongwei</author><pubDate>Wed, 29 Aug 2018 22:18:22 +0800</pubDate><description><![CDATA[在linux中我们都知道文件和目录的本质都是文件, 但是在我们通常的口语化中常常将它们区分.  
而且在linux, 文件和目录也是有区别的. 

linux中的基本权限是: r, w, x 
这三个基本权限对应于文件和目录有着不同的含义.  经验老道的程序员也常常犯错搞不清楚.




  文件/目录/权限
  r
  w
  x



  文件
  读文件内容
  修改文件内容
  能执行程序...]]></description><category></category></item><item><title><![CDATA[打印和换肤(vue简历编辑器)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82181341</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82181341</guid><author>Helloyongwei</author><pubDate>Wed, 29 Aug 2018 12:25:36 +0800</pubDate><description><![CDATA[打印

当我们点击打印的时候可以调用window对象的print()方法. 

&amp;lt;button class=&quot;button&quot; @click=&quot;print&quot;&amp;gt;打印&amp;lt;/button&amp;gt;

print(){
      window.print()
    }

打印的时候不能将侧边栏和多余信息也打印.  所以要将它们设置为none.

.page &amp;gt; aside {
   ...]]></description><category></category></item><item><title><![CDATA[typeof 和 instanceof]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82177915</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82177915</guid><author>Helloyongwei</author><pubDate>Wed, 29 Aug 2018 09:21:52 +0800</pubDate><description><![CDATA[我们在检测数据类型的时候常用两种方法. 分别是typeof和instanceof. 但是这两种方法各有不同. 



typeof

typeof 是我们开始学JavaScript是就会学习的方法. 这个方法作用于不同的数据类型返回不同的值. 如下图所示: 


从图中有几处需要我们注意的地方, 分别是undefined和null类型的返回值, object,array及function类型的返回...]]></description><category></category></item><item><title><![CDATA[完善登录逻辑, 完善项目/技能编辑以及分享功能(vue简历编辑器)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82149520</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82149520</guid><author>Helloyongwei</author><pubDate>Tue, 28 Aug 2018 17:58:19 +0800</pubDate><description><![CDATA[登录逻辑

当我们登录的时候, 才会有登出. 那么我们只有在用户登录的情况下才显示登出按钮. 检测状态用hasLogin()来确定, 当检测到用户id时标明用户登录, 没有检测到时表明没有用户登录: 

&amp;lt;button class=&quot;button&quot; @click=&quot;onLogout&quot; v-show=&quot;hasLogin()&quot;&amp;gt;登出

注意, hasLogin是在app的methods中的...]]></description><category></category></item><item><title><![CDATA[添加登陆注册功能(vue简历编辑器)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82120045</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82120045</guid><author>Helloyongwei</author><pubDate>Mon, 27 Aug 2018 22:20:20 +0800</pubDate><description><![CDATA[着重记录下思路以及关键代码. 完整代码请点击这里



触发登录/注册机制

当我们点击保存的时候, 检测是否有用户登录, 若没有用户登录, 则弹出登录框. 按情况让用户选择登录或者注册功能. 

 &amp;lt;button class=&quot;button&quot; @click=&quot;onClickSave&quot;&amp;gt;保存&amp;lt;/button&amp;gt;

onClickSave在vue实例app中的methods中定...]]></description><category></category></item><item><title><![CDATA[项目初始化(vue简历编辑器)]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/82111680</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/82111680</guid><author>Helloyongwei</author><pubDate>Mon, 27 Aug 2018 21:46:33 +0800</pubDate><description><![CDATA[项目的全部代码在这里, 这篇文章只会将主要的思路. 代码会不完整. 



初始化

这个编辑器如下图所示:

基本结构为: 
index.html



&amp;amp;amp;lt;div class=&amp;amp;quot;page&amp;amp;quot; id=&amp;amp;quot;app&amp;amp;quot;&amp;amp;amp;gt;
&amp;amp;amp;lt;aside&amp;amp;amp;gt;&amp;amp;amp;lt;/aside&amp;amp;]]></description><category></category></item><item><title><![CDATA[用vue做一个简单的button]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/81835841</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/81835841</guid><author>Helloyongwei</author><pubDate>Sun, 19 Aug 2018 10:36:28 +0800</pubDate><description><![CDATA[项目准备

安装parcel



npm i -D parcel-bundler

-D的意思是给开发人员用的.



基本结构



index.html
src
    button.vue
    app.js 

在index.html中引入src/app.js, 而app.js中引入了vue和button.vue.



src下的app.js和button.vue

在src中写下b...]]></description><category></category></item><item><title><![CDATA[模仿网易云音乐]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/81744047</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/81744047</guid><author>Helloyongwei</author><pubDate>Thu, 16 Aug 2018 16:22:15 +0800</pubDate><description><![CDATA[这是饥人谷系统版的毕设。 每节课写完代码后我稍微回忆下思路。日后也好照葫芦画瓢。 

下面几篇文章，我只着重记录思路， 代码只贴关键代码。 稍微完整的代码请点击这里

leanCloud环境搭建

七牛环境搭建

对项目进行css布局

在项目中使用发布订阅模式

获取歌曲

修改歌曲

上传加载loading

首页tab切换

获取歌曲页面

丰富歌曲页页面

为歌曲添加歌词...]]></description><category></category></item><item><title><![CDATA[为歌曲页添加歌词]]></title><link>https://blog.youkuaiyun.com/Helloyongwei/article/details/81738126</link><guid>https://blog.youkuaiyun.com/Helloyongwei/article/details/81738126</guid><author>Helloyongwei</author><pubDate>Thu, 16 Aug 2018 11:34:42 +0800</pubDate><description><![CDATA[上一节我们为歌曲页添加了封面。 这一节我们要为歌曲页添加歌词。 同样的， 我们的歌词在最初开始的时候并没有考虑在内。 我们回到song-form.js中，给data添加一个lyrics的属性表示歌词, 注意修改其它代码保证不会出错。 

我们的歌词填在如下结构：



&amp;lt;div class=&quot;song-description&quot;&amp;gt;
    &amp;lt;h1&amp;gt;&amp;lt;!--这里时歌名--...]]></description><category></category></item></channel></rss>