<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[OG]]></title><description><![CDATA[offgun is real!!!]]></description><link>https://blog.youkuaiyun.com/IT429</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; IT429]]></copyright><item><title><![CDATA[使用sass报错]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/120701909</link><guid>https://blog.youkuaiyun.com/IT429/article/details/120701909</guid><author>IT429</author><pubDate>Mon, 11 Oct 2021 14:04:26 +0800</pubDate><description><![CDATA[使用sass报错
报错如下：

原因：当前安装的sass版本过高
解决：在package.json文件中将sass的版本改为低版本的，再npm install就可以了

]]></description><category></category></item><item><title><![CDATA[【vue】for循环 一行两列]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/119348908</link><guid>https://blog.youkuaiyun.com/IT429/article/details/119348908</guid><author>IT429</author><pubDate>Tue, 03 Aug 2021 14:13:02 +0800</pubDate><description><![CDATA[&lt;template v-for="(v, i) in storeList" &gt;
  &lt;el-row gutter="24" :key="i" v-if='i%2 == 0'&gt;
    &lt;el-col span="6"&gt;
      左边的内容
    &lt;/el-col&gt;
    &lt;el-col span="6" v-if="i+1 &lt; storeList.length"&gt;
      右边的内容
    &lt;/el-col&gt;
  &]]></description><category></category></item><item><title><![CDATA[【javascript】中文逗号，转英文逗号,正则]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/115212324</link><guid>https://blog.youkuaiyun.com/IT429/article/details/115212324</guid><author>IT429</author><pubDate>Thu, 25 Mar 2021 16:36:56 +0800</pubDate><description><![CDATA[let str = '奥术大师,让他忽然，阳台上发生,神鼎飞丹砂'
str.replace(/，/ig,',')


]]></description><category></category></item><item><title><![CDATA[【javascript】js下载文件流 前端下载文件流 excel]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/113649749</link><guid>https://blog.youkuaiyun.com/IT429/article/details/113649749</guid><author>IT429</author><pubDate>Thu, 04 Feb 2021 15:44:38 +0800</pubDate><description><![CDATA[/**
* 下载文件流
* @param {*} data 接口返回的文件流
* @param {*} fileName 下载的文件名 eg: 客户名单.excel
*/
function downloadFiel (data, fileName) {
	const elink = document.createElement('a')
	elink.download = filenName

	const blob = new Bolb([data])
	elink.href = URL.createOb]]></description><category></category></item><item><title><![CDATA[【elementUI】switch确认后再改变状态 switch回调]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/113566141</link><guid>https://blog.youkuaiyun.com/IT429/article/details/113566141</guid><author>IT429</author><pubDate>Tue, 02 Feb 2021 17:04:28 +0800</pubDate><description><![CDATA[switch只有个change事件，但很多时候我们是需要用户确认后再去改变状态的，解决办法就是在调用change时把switch绑定的值的父级对象当参数，然后在change的回调里执行取反
&lt;el-switch v-model="form.isShow" @change="changeSwitch(form)"&gt;&lt;/el-switch&gt;

export default {
	data () {
		form: {
			isShow: true
		}
	},
	methods: {]]></description><category></category></item><item><title><![CDATA[【elementUI】form表单给upload上传组件校验]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/113522937</link><guid>https://blog.youkuaiyun.com/IT429/article/details/113522937</guid><author>IT429</author><pubDate>Mon, 01 Feb 2021 16:21:19 +0800</pubDate><description><![CDATA[解决办法：给表单el-form-item绑定个ref，然后在upload上传成功的回调里取消验证提示
&lt;el-form-item ref="headPortrait" label="头像" prop="headPortrait"&gt;
	&lt;el-upload v-model="form.headPortrait" 
		:action="action" :show-file-list="false" 
		:on-success="handleAvatarSuccess" &gt;
		&lt]]></description><category></category></item><item><title><![CDATA[【elementUI】级联选择器cascader数据回显]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/113399803</link><guid>https://blog.youkuaiyun.com/IT429/article/details/113399803</guid><author>IT429</author><pubDate>Fri, 29 Jan 2021 17:39:12 +0800</pubDate><description><![CDATA[elementUI的级联选择器cascader文档是没有如何回显已选择过的数据的样例和方法。但我们可以通过官方文档的getCheckedNodes方法来拿到选择过的数据然后再用v-model来绑定，这样就可以回显数据了

ps：我设置的cascader是多选的
下图是打印getCheckedNodes()返回的数据，我们找到children为空的那个数据，path字段就是其中一个选中的数据路径。
我们把所有children为空的path字段存到个数组里，绑定cascader的v-model就可以显示数据了。]]></description><category></category></item><item><title><![CDATA[【elementui】走马灯自适应图片高度宽度 走马灯图片显示不全]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112960199</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112960199</guid><author>IT429</author><pubDate>Thu, 21 Jan 2021 16:10:22 +0800</pubDate><description><![CDATA[场景：走马灯里有宽屏相片和竖屏相片共存时，超出走马灯设置的宽高后相片部分会被裁减，但我们希望无论什么分辨率的相片都能显示完全
页面代码：
&lt;template&gt;
  &lt;el-carousel arrow="always" indicator-position="outside"
  	:interval="2000" style="width:400px" height="300px"&gt;
    &lt;el-carousel-item v-for="item in imgs" :ke]]></description><category></category></item><item><title><![CDATA[【vue】vue中使用throttle 防抖 节流 避免多次提交]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112918632</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112918632</guid><author>IT429</author><pubDate>Thu, 21 Jan 2021 11:01:02 +0800</pubDate><description><![CDATA[场景：表单提交时，连续点击按钮的话会提交多次请求，为避免这种情况，我们就可以使用节流，说白了就是限制频率，比如在2秒内无论点击了多少次，都只请求一次接口
示例代码用的是Lodash库的语法，你也可以自己封装
export default {
	return {
		methods: {
			getList: _.throttle(function () {
				//...
			}, 1000, { 'trailing': false })
		}
	}
}


...]]></description><category></category></item><item><title><![CDATA[【css】响应式布局 @media媒介 适配平板手机]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112918379</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112918379</guid><author>IT429</author><pubDate>Thu, 21 Jan 2021 10:44:59 +0800</pubDate><description><![CDATA[// 大型设备（大台式电脑，1200px 起）
@media screen and (min-width:1200px) {
  //...
}

// 中型设备（台式电脑，992px 起）
@media screen and (min-width:992px) and (max-width:1200px) { 
  //...
}

// 小型设备（平板电脑，768px 起）
@media screen and (min-width:768px) and (max-width:992px) {
  //.]]></description><category></category></item><item><title><![CDATA[【vue】插槽 具名插槽 作用域插槽 插槽传参]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112907448</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112907448</guid><author>IT429</author><pubDate>Wed, 20 Jan 2021 18:10:38 +0800</pubDate><description><![CDATA[具名插槽
子组件：
&lt;slot name="slotName"&gt;&lt;/slot&gt;

父组件：
&lt;template slot="slotName"&gt;
	&lt;div&gt;
		插槽内容
	&lt;/div&gt;
&lt;/template&gt;

插槽传参
子组件：
&lt;slot name="slotName" :row="data"&gt;&lt;/slot&gt;

父组件：
&lt;template v-slot:slotName="data"&gt;
	&]]></description><category></category></item><item><title><![CDATA[【axios】封装axios]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112904150</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112904150</guid><author>IT429</author><pubDate>Wed, 20 Jan 2021 17:43:27 +0800</pubDate><description><![CDATA[在项目的utils文件夹下建个request.js
import axios from 'axios'
import { getToken } from '@/utils/auth'

axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'

// 创建axios实例
const service = axios.create({
  // axios中请求配置有baseURL选项，表示请求URL公共部分
  base]]></description><category></category></item><item><title><![CDATA[【vue+elementui】v-for循环生成的表单项、动态生成的表单项的校验]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112849057</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112849057</guid><author>IT429</author><pubDate>Tue, 19 Jan 2021 18:22:48 +0800</pubDate><description><![CDATA[v-for循环生成的表单项、动态生成的表单项都有个特性，就是prop不确定，没有prop的话我们就无法像普通表单验证那样校验，所以我们要用:prop来校验。
语法：
:prop="`v-for绑定的数组.${v-for的索引}.v-model绑定的变量`"

示例如下：
&lt;el-form :model="organForm" ref="organForm"&gt;
	&lt;el-card v-for="(item, idx) in organForm.organList" :key="idx"&gt]]></description><category></category></item><item><title><![CDATA[【javascript】格式化秒数为x时x分x秒格式文本]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112836359</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112836359</guid><author>IT429</author><pubDate>Tue, 19 Jan 2021 15:20:36 +0800</pubDate><description><![CDATA[有时后台只返回秒数给我，但产品却要展示时分秒。js代码如下：
export function formatSecond (value) {
  var theTime = parseInt(value)// 秒
  var middle = 0// 分
  var hour = 0// 小时

  if (theTime &gt; 60) {
    middle = parseInt(theTime / 60)
    theTime = parseInt(theTime % 60)
    if (mi]]></description><category></category></item><item><title><![CDATA[【vue+elementui】自定义表单项label]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/112834745</link><guid>https://blog.youkuaiyun.com/IT429/article/details/112834745</guid><author>IT429</author><pubDate>Tue, 19 Jan 2021 15:07:13 +0800</pubDate><description><![CDATA[创建表单时，若要对某个表单项做解释就要加问题引导，虽然el-form-item的label值类型是string，但我们可以用slot来自定义label的内容，代码如下：

效果如下：


]]></description><category></category></item><item><title><![CDATA[【javascript】最新正则校验 支持手机、身份证、车牌号、用逗号隔开的数字等等 持续更新！]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/109616057</link><guid>https://blog.youkuaiyun.com/IT429/article/details/109616057</guid><author>IT429</author><pubDate>Tue, 19 Jan 2021 14:56:31 +0800</pubDate><description><![CDATA[手机号
/^1[3|4|5|7|8][0-9]{9}$/

座机
/^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/

身份证
/^\d{15}|\d{18}$/

密码（以字母开头，长度在6~18之间，只能包含字母、数字和下划线）
/^[a-zA-Z]\w{5,17}$/

QQ
/^[1-9][0-9]{4,9}$/

只出现数字+中文逗号或英文逗号
/^\d+(,\d+)|\d+(，\d+)*$/

只出现数字+英文逗号
/^\d+(,\d+)*$/


...]]></description><category></category></item><item><title><![CDATA[【vue+elementui】时间选择器：时间格式、设置时间最大日期或最小日期、设置时间选择范围]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/102931317</link><guid>https://blog.youkuaiyun.com/IT429/article/details/102931317</guid><author>IT429</author><pubDate>Wed, 06 Nov 2019 11:39:25 +0800</pubDate><description><![CDATA[时间格式
新版的elementui新增了定义时间格式的属性value-format，这样就不用再自己写js在各种格式间转换。

例：
下面例子在获取startDate时返回的就是’2019-11-06 11:17:13’
&lt;el-date-picker v-model="startDate" type="date" :value-format="'yyyy-MM-dd HH:mm:ss'"&...]]></description><category></category></item><item><title><![CDATA[window 升级node]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/88619709</link><guid>https://blog.youkuaiyun.com/IT429/article/details/88619709</guid><author>IT429</author><pubDate>Sun, 17 Mar 2019 15:08:41 +0800</pubDate><description><![CDATA[听说vue-cli 3.0 版本可以减少很多配置项，然后就想着升级下哇，结果vue-cli 3.0还要node版本是8.9 或更高版本，无奈那就把node也升下级。但是…氮素，我通过npm升级node第一行命令就报错了！报错图如下：

这是怎么回事？？一通搜索后发现原来node的n模块并不支持windows。
所以只能去官网下载你想要的版本，然后卸载原来的版本再安装。卸载也很简单，Node.js有...]]></description><category></category></item><item><title><![CDATA[【javascript】前端分页]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/87070512</link><guid>https://blog.youkuaiyun.com/IT429/article/details/87070512</guid><author>IT429</author><pubDate>Tue, 12 Feb 2019 10:03:46 +0800</pubDate><description><![CDATA[有时后台会把数据全部返回，而前端需要自己分页。虽说这种情况比较少，但还是有的。比如某个接口查询速度太慢，如果每次换分页都要请求的话，那么用户体验是极其不好的。
前端分页主要就数据的分割，比如一页需要5条数据，那么就把所有数据按5等份分好，然后根据页数获取相应的那页数据。
代码如下：
/**
* 	获取按指定数量分割数组的结果
*  @params: list要分割的数组
*  @params: n...]]></description><category></category></item><item><title><![CDATA[vue-router 打开新窗口新tab页]]></title><link>https://blog.youkuaiyun.com/IT429/article/details/86569457</link><guid>https://blog.youkuaiyun.com/IT429/article/details/86569457</guid><author>IT429</author><pubDate>Mon, 21 Jan 2019 10:00:21 +0800</pubDate><description><![CDATA[有时候需求需要点击某个按钮能新开一个tab页显示内容，有两种方式可以实现。
一：&amp;lt;router-link&amp;gt;&amp;lt;/router-link&amp;gt;
//关键点：target=&quot;_blank&quot;
&amp;lt;router-link target=&quot;_blank&quot; to=&quot;/sys/setting&quot;&amp;gt;系统设置&amp;lt;/router-link&amp;gt;

二：vue-router提]]></description><category></category></item></channel></rss>