<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Sweet_Waf的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Sweet_Waf</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Sweet_Waf]]></copyright><item><title><![CDATA[git修改分支名称]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/129706203</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/129706203</guid><author>Sweet_Waf</author><pubDate>Wed, 22 Mar 2023 11:29:21 +0800</pubDate><description><![CDATA[git修改分支名称]]></description><category></category></item><item><title><![CDATA[vue input输入框限制输入负号、数字、以及两位小数]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/129661493</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/129661493</guid><author>Sweet_Waf</author><pubDate>Mon, 20 Mar 2023 10:16:40 +0800</pubDate><description><![CDATA[vue input输入框限制输入数字及两位小数]]></description><category></category></item><item><title><![CDATA[优化多个if...else]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/128189455</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/128189455</guid><author>Sweet_Waf</author><pubDate>Mon, 05 Dec 2022 16:53:38 +0800</pubDate><description><![CDATA[优化if...else]]></description><category></category></item><item><title><![CDATA[React 尚硅谷学习笔记]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/127141298</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/127141298</guid><author>Sweet_Waf</author><pubDate>Sun, 02 Oct 2022 11:33:43 +0800</pubDate><description><![CDATA[React学习笔记]]></description><category></category></item><item><title><![CDATA[web前端性能优化]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/123498862</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/123498862</guid><author>Sweet_Waf</author><pubDate>Tue, 15 Mar 2022 12:14:37 +0800</pubDate><description><![CDATA[一、页面内容优化
1.减少http请求次数
2.减少DNS查询次数
3.避免页面跳转
4.缓存ajax
5.延迟加载
6.预加载
7.减少dom元素数量
8.减少iframe数量
9.避免404
二、css优化
1.将样式表置顶
2.用link代替@import
3.避免使用filters
4.css文件合并压缩
三、js代码优化
1.将脚本置底
2.使用外部js文件和css文件
3.去除重复脚本，避免重复的资源请求
4.减少dom访问（修改和访问DOM元素会造成页面的重绘和重排，循环对DOM操作更是减慢页]]></description><category></category></item><item><title><![CDATA[v-html 点击事件不生效解决办法]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/108340971</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/108340971</guid><author>Sweet_Waf</author><pubDate>Tue, 01 Sep 2020 14:34:05 +0800</pubDate><description><![CDATA[保姆级教程
从后台获取的字符串中含有@click事件，而鼠标点进去却不生效，解决办法就是使用组件渲染而不是v-html。具体代码如下：
&lt;template&gt;
  &lt;div&gt;
&lt;!--  props中的字符串 从后台获取到的 传给子组件 --&gt;
    &lt;article :html="matchcontent"&gt;&lt;/article&gt;
  &lt;/div&gt;

&lt;/template&gt;
&lt;script&gt;
  import {]]></description><category></category></item><item><title><![CDATA[vue 后退不刷新]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/108121759</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/108121759</guid><author>Sweet_Waf</author><pubDate>Thu, 20 Aug 2020 13:37:25 +0800</pubDate><description><![CDATA[假设有两个页面:列表页A和详情页B，现需求从A页面进入B页面刷新，从B页面回退A页面不刷新。
解决方案使用keepAlive
在 App.vue 插入以下代码：
 &lt;keep-alive&gt;
      &lt;router-view v-if="$route.meta.keepAlive"&gt;
        &lt;!-- 这里是会被缓存的视图组件，比如 Home！ --&gt;
      &lt;/router-view&gt;
    &lt;/keep-alive&gt;

   ]]></description><category></category></item><item><title><![CDATA[vue 子组件调用父组件中的方法]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/107519993</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/107519993</guid><author>Sweet_Waf</author><pubDate>Wed, 22 Jul 2020 20:42:49 +0800</pubDate><description><![CDATA[第一种在子组件中通过this.$parent.event来调用；
父组件：
&lt;template&gt;
  &lt;div&gt;
    &lt;testchild&gt;&lt;/testchild&gt;
  &lt;/div&gt;
&lt;/template&gt;
&lt;script&gt;
  import testchild from "./testchild";
  export default {
    components: {
      testchild
    },
]]></description><category></category></item><item><title><![CDATA[echarts图例分页和图例之间的间距]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106873051</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106873051</guid><author>Sweet_Waf</author><pubDate>Sat, 20 Jun 2020 15:38:44 +0800</pubDate><description><![CDATA[echarts图例分页和图例之间的间距在配置文件中找到legend属性添加type="scroll"即可，感兴趣的小朋友可以一试。
开发过程中，我们经常会遇到各种各样的奇葩需求，这时就需要我们随机应变啦！
当我们使用echarts图表时，数据量一般都会很大，图例往往会多的挤到下面的图中，若是能把图例写成分页就可以很好的解决这一问题。

   &lt;div id="main" style="height:600px;"&gt;&lt;/div&gt;
   &lt;script&gt;
   		var m]]></description><category></category></item><item><title><![CDATA[elementui表格分页功能的实现]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106735799</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106735799</guid><author>Sweet_Waf</author><pubDate>Sat, 13 Jun 2020 18:02:08 +0800</pubDate><description><![CDATA[elementui表格分页功能的实现废话不多说，直接上代码最终实现效果![效果](https://img-blog.csdnimg.cn/20200613175934209.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N3ZWV0X1dhZg==,size_16,color_FFFFFF,t_70)
废话不多说，直接上代码
&lt;templat]]></description><category></category></item><item><title><![CDATA[表格td的宽度不随内容自适应]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106431006</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106431006</guid><author>Sweet_Waf</author><pubDate>Fri, 29 May 2020 18:35:57 +0800</pubDate><description><![CDATA[表格td的宽度不随内容自适应
在table上添加 style=”table-layout:fixed;word-break:break-all;”
然后在相应的td上添加宽高即可。
语法：
word-break:normal;使用浏览器默认的换行规则；
word-break:break-all;允许在单词内换行；
word-break:keep-all;只能在半角空格或连字符处换行；
table-layout:automatic;默认，列宽度由单元格内容设定；
table-layout:fixed;列宽由表]]></description><category></category></item><item><title><![CDATA[数组对象去重]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106116589</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/106116589</guid><author>Sweet_Waf</author><pubDate>Thu, 14 May 2020 11:39:06 +0800</pubDate><description><![CDATA[数组对象去重
var list=[
{name:"aaa",value:"111111"},
{name:"bbb",value:"22222"},
{name:"ccc",value:"33333"},
{name:"aaa",value:"4444"}
];
//数组对象去重
function unique(arr){
    //  利用对象访问属性的方法，判断对象中是否存在key
    var newArr = [];
    var obj = {};
    for (var i = 0; i]]></description><category></category></item><item><title><![CDATA[关于echarts的y轴文字超出的解决方案]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/100880084</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/100880084</guid><author>Sweet_Waf</author><pubDate>Mon, 16 Sep 2019 10:37:45 +0800</pubDate><description><![CDATA[关于echarts的y轴文字超出的解决方案

类似这种，文字超出用“…”替换，具体代码如下：
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, init...]]></description><category></category></item><item><title><![CDATA[下拉多选插件]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/97396949</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/97396949</guid><author>Sweet_Waf</author><pubDate>Fri, 26 Jul 2019 18:24:32 +0800</pubDate><description><![CDATA[关于下拉多选插件select2的使用方法formSelect的用法见下
目前我了解到的下拉多选的插件有两个，一个是select2,另一个是formSelect。
本文主要介绍如何使用这两个插件。
select2的使用方法
到github上选择一个版本下载到本地
github网址: https://github.com/select2/select2/tags;
select2网址：https://...]]></description><category></category></item><item><title><![CDATA[什么是伪数组，如何将伪数组转为真数组]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/96486433</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/96486433</guid><author>Sweet_Waf</author><pubDate>Fri, 19 Jul 2019 17:42:39 +0800</pubDate><description><![CDATA[什么是伪数组，如何将伪数组转为真数组注意：如果length的属性值为0，那么这个对象有没有元素都无所谓；若是length的值不为0，则这个对象中一定会有下标为length-1的属性值。

什么是伪数组？
常见的伪数组有：
a.具有length属性；
例如：
var obj={0:“lily”,1:21,2:“abc”} //不是伪数组，没有length属性
var obj={0:“lily”,1:...]]></description><category></category></item><item><title><![CDATA[jquery动态添加、删除dom元素]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/95360378</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/95360378</guid><author>Sweet_Waf</author><pubDate>Wed, 10 Jul 2019 18:03:55 +0800</pubDate><description><![CDATA[jquery动态添加、删除dom元素点击标签，在下方动态添加选中的元素及内容，再次点击标签，在下方动态删除选中的标签及元素
点击标签，在下方动态添加选中的元素及内容，再次点击标签，在下方动态删除选中的标签及元素
如图默认状态

点击1和2时，如图

再次点击1，效果如图

具体代码html代码如下：
&lt;div class="layui-card"&gt;
				&lt;div class=...]]></description><category></category></item><item><title><![CDATA[echarts图表与tab页连用时图表不显示问题]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/93759773</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/93759773</guid><author>Sweet_Waf</author><pubDate>Wed, 26 Jun 2019 18:00:31 +0800</pubDate><description><![CDATA[echarts图表与tab页连用时图表不显示问题有时候图表会放在多个标签页里，那些初始隐藏的标签在初始化图表的时候因为获取不到容器的实际高宽，可能会绘制失败，因此在切换到该标签页时需要手动调用 resize 方法获取正确的高宽并且刷新画布，或者在 opts 中显示指定图表高宽。
有时候图表会放在多个标签页里，那些初始隐藏的标签在初始化图表的时候因为获取不到容器的实际高宽，可能会绘制失败，因此在切换...]]></description><category></category></item><item><title><![CDATA[iconFont的三种使用方法--Font class]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/93224412</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/93224412</guid><author>Sweet_Waf</author><pubDate>Fri, 21 Jun 2019 19:49:48 +0800</pubDate><description><![CDATA[iconFont的三种使用方法--Font class如何避免样式冲突
打开iconfont的官网，搜索你想要的图标，以“文件”为例


点击购物车添加至项目，点击确定。如果没有项目，新建一个即可


点击确定后会进入下面的界面

先更新代码 然后再复制到项目中去


复制到项目中

直接在标签里引用类名即可


如何避免样式冲突
一般我们在项目中定义的样式很容易冲突，如何避免呢？


在我的项目...]]></description><category></category></item><item><title><![CDATA[layui中layui-form与select2下拉多选样式冲突的解决方案]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/92088102</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/92088102</guid><author>Sweet_Waf</author><pubDate>Sat, 15 Jun 2019 15:07:17 +0800</pubDate><description><![CDATA[layui中layui-form与select2下拉多选样式冲突的解决方案@TOC
去掉搜索按钮

打开控制面板f12 查看元素


可以看到搜索按钮是由after动态生成，找到这个样式文件，然后注释

清除浏览器缓存（ctrl+shift+del），刷新，可以看到

小按钮已经没有了。

去除layui-form的搜索框

还是老样子  查看页面元素f12

确定元素所在位置，通过jquery删...]]></description><category></category></item><item><title><![CDATA[layui中select下拉显示不全解决方案]]></title><link>https://blog.youkuaiyun.com/Sweet_Waf/article/details/91855801</link><guid>https://blog.youkuaiyun.com/Sweet_Waf/article/details/91855801</guid><author>Sweet_Waf</author><pubDate>Thu, 13 Jun 2019 14:21:45 +0800</pubDate><description><![CDATA[layui中select下拉显示不全解决方案@TOC

解决方案
 td[data-field='wjxyioc'] .layui-table-cell{
            overflow: visible !important;
        }
        .layui-table-body{
            overflow: visible !important;
 ...]]></description><category></category></item></channel></rss>