<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[blue beard的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/thesize</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; thesize]]></copyright><item><title><![CDATA[Vue 前端 下载 zip/excel文件流blob]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/125389604</link><guid>https://blog.youkuaiyun.com/thesize/article/details/125389604</guid><author>thesize</author><pubDate>Tue, 21 Jun 2022 13:59:24 +0800</pubDate><description><![CDATA[Vue 前端 下载 zip/excel文件流blob]]></description><category></category></item><item><title><![CDATA[vue div模拟input的placeholder属性]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/125223013</link><guid>https://blog.youkuaiyun.com/thesize/article/details/125223013</guid><author>thesize</author><pubDate>Fri, 10 Jun 2022 16:28:29 +0800</pubDate><description><![CDATA[div模拟input的placeholder属性]]></description><category></category></item><item><title><![CDATA[css 设置行内元素顶部对齐]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/124015272</link><guid>https://blog.youkuaiyun.com/thesize/article/details/124015272</guid><author>thesize</author><pubDate>Thu, 07 Apr 2022 14:09:38 +0800</pubDate><description><![CDATA[display: inline-block;vertical-align: top;


]]></description><category></category></item><item><title><![CDATA[js-image-compressor 图片压缩插件]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/123917072</link><guid>https://blog.youkuaiyun.com/thesize/article/details/123917072</guid><author>thesize</author><pubDate>Sat, 02 Apr 2022 11:58:08 +0800</pubDate><description><![CDATA[1.安装插件
npm i js-image-compressor

2.引入
import ImageCompressor from 'js-image-compressor'

3.使用
    compressionImage (file) {
      return new Promise((resolve, reject) =&gt; {
        // eslint-disable-next-line no-new
        new ImageCompressor({
       ]]></description><category></category></item><item><title><![CDATA[vue3 + ts + vite 学习笔记 （使用props传递复杂类型的数据）]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/122368782</link><guid>https://blog.youkuaiyun.com/thesize/article/details/122368782</guid><author>thesize</author><pubDate>Tue, 08 Feb 2022 13:41:47 +0800</pubDate><description><![CDATA[在使用 TypeScript 的情况下，直接获取子组件的数据，肯定会出现报错；
因为 HTMLElement 接口，不存在子组件的字段；


]]></description><category></category></item><item><title><![CDATA[vue3 + ts + vite 学习笔记 （老 ref 与 新 ref 混用）]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/122366877</link><guid>https://blog.youkuaiyun.com/thesize/article/details/122366877</guid><author>thesize</author><pubDate>Fri, 07 Jan 2022 16:14:30 +0800</pubDate><description><![CDATA[老 ref 与 新 ref 混用
文章：Vue 官方文档 - 模板引用
链接：https://v3.cn.vuejs.org/guide/composition-api-template-refs.html
使用组合式 API 时，需要事先声明 ref 并在 setup() 返回；
使用 TypeScript 的时候，ref 默认值为 null 同时变量类型也为 null 的话，后续的参数调用，则会出现类型报错，这时候需要使用到 泛型 + 接口；
注解：
好像虚拟 DOM 没有接口，只能通过泛型来替代；
c]]></description><category></category></item><item><title><![CDATA[运行Serve报错Vue和vue-template-compiler版本不一致问题]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/121922048</link><guid>https://blog.youkuaiyun.com/thesize/article/details/121922048</guid><author>thesize</author><pubDate>Tue, 14 Dec 2021 10:49:10 +0800</pubDate><description><![CDATA[在vue项目运行时终端报错package.json中Vue和vue-template-compiler版本不一致，提示vue和vue-template-compiler版本不匹配的问题，解决办法：
先执行npm uninstall vue-template-compiler；然后再执行npm install vue-template-compiler@报错中提示的vue的版本号；
安装完后再次运行即可。

...]]></description><category></category></item><item><title><![CDATA[Vue3 + vite 学习笔记]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/121076655</link><guid>https://blog.youkuaiyun.com/thesize/article/details/121076655</guid><author>thesize</author><pubDate>Mon, 01 Nov 2021 17:40:14 +0800</pubDate><description><![CDATA[一、 搭建第一个 Vite 项目
https://vitejs.cn/guide/
项目模板的话暂时没有，只能创建个最基础的项目。
二、初试
setup()
所有的逻辑代码都写在这个函数中。

computed()
与vue2中computed配置功能一致


]]></description><category></category></item><item><title><![CDATA[video 自动循环播放的问题]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/118148293</link><guid>https://blog.youkuaiyun.com/thesize/article/details/118148293</guid><author>thesize</author><pubDate>Wed, 23 Jun 2021 11:27:37 +0800</pubDate><description><![CDATA[video 自动循环播放
video只加autoplay并不能自动播放，还需要再加上muted
	&lt;video  class="covervid-video" autoplay loop muted&gt;

		&lt;source src="./videos/9b23cc1032ae0346365d14733a262d35.ogg" type="video/ogg" /&gt;

		&lt;source src="./videos/9b23cc1032ae0346365d14733a262d35]]></description><category></category></item><item><title><![CDATA[css 双击选中文字时取消蓝色色块]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/116789281</link><guid>https://blog.youkuaiyun.com/thesize/article/details/116789281</guid><author>thesize</author><pubDate>Fri, 14 May 2021 13:58:25 +0800</pubDate><description><![CDATA[js 双击选中文字时取消蓝色色块
只需要在css中设置 user-select属性为none即可
div{
    user-select:none;
    -ms-user-select:none; // IE
    -moz-user-select:none; // 火狐
    -khtml-user-select:none; // 早期浏览器
    -webkit-user-select:none;
}


...]]></description><category></category></item><item><title><![CDATA[vue 修改浏览器滑块样式]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/116789015</link><guid>https://blog.youkuaiyun.com/thesize/article/details/116789015</guid><author>thesize</author><pubDate>Fri, 14 May 2021 13:47:58 +0800</pubDate><description><![CDATA[vue 修改浏览器滑块样式
在style中：
::-webkit-scrollbar // 滑块宽度
{
  width: 3px;
  // height: 1px;
}

::-webkit-scrollbar-track { //轨道部分
  // box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  // background: #ededed;
  // border-radius: 3px;
}
// 定义滑块 内阴影+圆角

::-webkit-scroll]]></description><category></category></item><item><title><![CDATA[JavaScript基础]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/115618531</link><guid>https://blog.youkuaiyun.com/thesize/article/details/115618531</guid><author>thesize</author><pubDate>Fri, 23 Apr 2021 00:37:38 +0800</pubDate><description><![CDATA[JavaScriptJavaScript 基础最新的 ECMAScript 2020 标准定义了 8 种数据类型:基本类型引用类型&amp;&amp;  ||  !! 运算符分别是什么意思？能做什么？浅拷贝与深拷贝分别是什么意思？有什么区别？对象解构展开运算符箭头函数Object.assign 深拷贝还是浅拷贝？null 和 undefined 的区别？Array everyArray some进阶多个异步任务并发运行Promise.all()如何获得粘贴内容?
JavaScript 基础
最新的 ECMA]]></description><category></category></item><item><title><![CDATA[js 关闭页面时弹框提醒]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/114819512</link><guid>https://blog.youkuaiyun.com/thesize/article/details/114819512</guid><author>thesize</author><pubDate>Fri, 19 Mar 2021 16:58:36 +0800</pubDate><description><![CDATA[合并数组为一个新的数组
你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。
新的改变
我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：

全新的界面设计 ，将会带来全新的写作体验；
在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示；
增加了 图片拖拽 功]]></description><category></category></item><item><title><![CDATA[uniapp-顶部胶囊按钮组件]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/113309210</link><guid>https://blog.youkuaiyun.com/thesize/article/details/113309210</guid><author>thesize</author><pubDate>Thu, 28 Jan 2021 10:31:43 +0800</pubDate><description><![CDATA[组件代码如下：
&lt;template&gt;
	&lt;view class="navigation-bar" :style="'height:'+height"&gt;
		&lt;view class="navigation-bar-fixed" :style="{height:height,background:(!config.transparent&amp;&amp;!config.linear)?config.bgcolor:'transparent'}"&gt;
			&lt;!-- ca]]></description><category></category></item><item><title><![CDATA[两个undefined的值拼接会有length的情况]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/113263616</link><guid>https://blog.youkuaiyun.com/thesize/article/details/113263616</guid><author>thesize</author><pubDate>Wed, 27 Jan 2021 18:56:47 +0800</pubDate><description><![CDATA[两个undefined的值拼接会有length的情况
在做项目时需要用到一个值去做if判断，而这个值是由另外两个值拼接起来的字符串
 				try{
					let delec=await new this.Request(this.apiy.getm().tongzhi).gety();
					let datas=delec.data.code=="200"?delec.data.data:[];
					this.texty=datas.noticeName+","+datas.noticeC]]></description><category></category></item><item><title><![CDATA[uniapp-图片放大]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/113244902</link><guid>https://blog.youkuaiyun.com/thesize/article/details/113244902</guid><author>thesize</author><pubDate>Wed, 27 Jan 2021 11:46:37 +0800</pubDate><description><![CDATA[uniapp-图片放大
单个图片
            previewImges(url) {
                let imgsArray = [];
                imgsArray[0] = url
                uni.previewImage({
                    current: 0,
                    urls: imgsArray
                });
            }]]></description><category></category></item><item><title><![CDATA[解决循环中的点击事件传item，打印为undefined的问题]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/112790447</link><guid>https://blog.youkuaiyun.com/thesize/article/details/112790447</guid><author>thesize</author><pubDate>Mon, 18 Jan 2021 18:12:47 +0800</pubDate><description><![CDATA[传参item，打印为undefined的问题
由于自己经验不是很丰富的原因，在项目中一点击事件传参，打印出来一直是undefined，明明自己传的是item，页面渲染也没问题，排查了许久，百思不得其解。


后面又仔细的把数据看了一遍，发现返回的数据里没有id,换成:key="inedx"后，打印结果正常，结果真的是让人哭笑不得，所以在这分享一下

...]]></description><category></category></item><item><title><![CDATA[uniapp-发起微信支付]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/112788902</link><guid>https://blog.youkuaiyun.com/thesize/article/details/112788902</guid><author>thesize</author><pubDate>Mon, 18 Jan 2021 18:00:02 +0800</pubDate><description><![CDATA[uniapp-发起微信支付
直接上代码：
uni.requestPayment({
		nonceStr: res.data.nonce_str, // 调取下单接口后台返回的数据
		package: `prepay_id=${res.data.prepay_id}`, // 必须加前缀prepay_id=xxxxxxxx 
		paySign: res.data.paySign, //　　调取下单接口后台返回的数据  
		signType: "MD5", //　　调取下单接口后台返回的数据
		tim]]></description><category></category></item><item><title><![CDATA[uniapp-获取当前时间将其格式化]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/112618998</link><guid>https://blog.youkuaiyun.com/thesize/article/details/112618998</guid><author>thesize</author><pubDate>Fri, 15 Jan 2021 09:22:04 +0800</pubDate><description><![CDATA[uniapp-获取当前时间将其格式化
在项目里新建一个commit文件夹，添加一个datetimes.js的文件
代码如下：
function datastime(type){
	let myDate = new Date();  //获取当前时间
	let yinian=myDate.getFullYear(); //年
	let yer=parseInt(myDate.getMonth())+1;//月份
	if(yer&lt;=9){yer="0"+yer;}
	let riqi=myDate.get]]></description><category></category></item><item><title><![CDATA[uniapp-发送验证码(节流)]]></title><link>https://blog.youkuaiyun.com/thesize/article/details/112530689</link><guid>https://blog.youkuaiyun.com/thesize/article/details/112530689</guid><author>thesize</author><pubDate>Tue, 12 Jan 2021 15:46:11 +0800</pubDate><description><![CDATA[uniapp-发送验证码(节流)
做项目时在写发送验证码的时候忘记写节流，写完后测试时才发现，写的时候又突然忘记写法了，决定还是记下来为好,还算比较简单，一看就能看懂；
代码如下：
export default {
	data(){
		return{
			totalTime: 60,
			canClick: true, // 节流
			clockTimer: null, //定时器
			codeText: '获取验证码',
		}
	},
	methods: {
		onSendCode() {
]]></description><category></category></item></channel></rss>