<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[qq_41206305的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/qq_41206305</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; qq_41206305]]></copyright><item><title><![CDATA[vue启用打印机打印-二维码条形码打印]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/133773638</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/133773638</guid><author>qq_41206305</author><pubDate>Wed, 11 Oct 2023 16:53:02 +0800</pubDate><description><![CDATA[使用px来设置距离需谨慎，相同px在不同纸张呈现大小可能是不相同的。小距离的变动px是无法呈现的。（举个栗子：在某一纸张上1px=0.3mm，此时我只想上移0.2mm）构建所需要打印的内容，利用vue-print-nb进行打印。二维码条形码打印的本质就是图片打印。注意：在页面上设置的样式打印时是没效果的，这里需要用过媒体查询来设置样式。所需插件 vue-print-nb 本文版本1.7.5。资产、设备管理必备的二维码条形码打印。]]></description><category></category></item><item><title><![CDATA[vue扫码枪应用]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/132068331</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/132068331</guid><author>qq_41206305</author><pubDate>Wed, 02 Aug 2023 17:59:20 +0800</pubDate><description><![CDATA[扫码枪本质是键盘按键输入，扫码枪在扫码完成会有一个回车输入，我们可以将回车键视为扫码完成。所以监听扫码枪输入实际就是监听按键输入。barCode ：储存扫码数据。]]></description><category></category></item><item><title><![CDATA[vue输入框输入小写字母自动变大写]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/132067873</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/132067873</guid><author>qq_41206305</author><pubDate>Wed, 02 Aug 2023 17:35:03 +0800</pubDate><description><![CDATA[这里记录一个方法 直接上代码。]]></description><category></category></item><item><title><![CDATA[vue关于json数据格式的展示＜pre＞标签的使用]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/132067708</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/132067708</guid><author>qq_41206305</author><pubDate>Wed, 02 Aug 2023 17:30:44 +0800</pubDate><description><![CDATA[直接展示或者利用JSON.parse()展示页面上数据都会挤成一坨。需要把字符串按json格式展示到页面上。]]></description><category></category></item><item><title><![CDATA[vue使用jquery.wordexport导出word文档（批量导出为zip）]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/128917882</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/128917882</guid><author>qq_41206305</author><pubDate>Tue, 07 Feb 2023 14:53:27 +0800</pubDate><description><![CDATA[网上查了很多jquery.wordexport的文章都是只支持单独导出word，不符合业务需求。因此修改了jquery.wordexport、利用jszip、file-saver批量导出word。]]></description><category></category></item><item><title><![CDATA[关于jspdf安装失败（超时）]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/128345198</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/128345198</guid><author>qq_41206305</author><pubDate>Fri, 16 Dec 2022 17:27:32 +0800</pubDate><description><![CDATA[关于jspdf安装失败（超时）的解决方案]]></description><category></category></item><item><title><![CDATA[vue 利用v-model语法糖封装组件并实现＜component＞动态组件]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/126100404</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/126100404</guid><author>qq_41206305</author><pubDate>Mon, 01 Aug 2022 15:21:59 +0800</pubDate><description><![CDATA[利用v-model语法糖封装组件并实现动态组件主要是为了统一渲染element组件和自定义组件。v-model双向绑定实际就是数据绑定+事件绑定的一个语法糖。我们可以利用v-model的实现原理对组件进行封装。...]]></description><category></category></item><item><title><![CDATA[列表自动滚动的实现及＜Element＞ which has only a getter错误的解决]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/122436088</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/122436088</guid><author>qq_41206305</author><pubDate>Tue, 11 Jan 2022 16:49:22 +0800</pubDate><description><![CDATA[问题
最近在做列表自动滚动时遇到了
Cannot set property scrollTop of # which has only a getter"错误
原因
在style中，未添加overflow属性
解决
.box {
  overflow: hidden;// 重点
   width: 800px;
  height: 600px;
}

附上列表自动滚动代码
handleScroll(num) {
            // 初始化定时器
            if (this.timer]]></description><category></category></item><item><title><![CDATA[vue模拟a标签设置请求头headers接受文件流，导出xlsx文件]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/121516784</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/121516784</guid><author>qq_41206305</author><pubDate>Wed, 24 Nov 2021 15:42:02 +0800</pubDate><description><![CDATA[今天后端提供了一个导出xlsx文件的接口，这里做一篇实现xlsx文件导出的技术总结。分别关于后端是否提供xlsx文件流，还是json格式数据
a标签导出xlsx文件
我们可以直接通过，a标签href，浏览器直接调接口导出xlsx文件。但是当接口有权限认证时，a标签不能添加请求头，权限认证通过不了。
&lt;a href="url接口地址"&gt;导出文档&lt;/a&gt; 


axios模拟a标签
注意这里响应类型要设置为blob
 			this.axios
                .get(]]></description><category></category></item><item><title><![CDATA[vue路由$router.push()的三种传参方式]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/121494328</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/121494328</guid><author>qq_41206305</author><pubDate>Tue, 23 Nov 2021 15:44:48 +0800</pubDate><description><![CDATA[$ router.push() 的三种传参方式
最近在工作中遇到需要使用$router.push传递一个对象，在这里做一下技术总结
通过path传参
很常用的一种，传递的参数会显示到path中，在刷新页面时数据不会丢失，常用于数据的新增、编辑、查看详情。
this.$router.push(`pushAdd/${id}`)

路由配置
{
                path: '/pushAdd/:id',
                component: () =&gt; import('@/v]]></description><category></category></item><item><title><![CDATA[js数字转为中文数字]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/120995272</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/120995272</guid><author>qq_41206305</author><pubDate>Wed, 27 Oct 2021 16:08:15 +0800</pubDate><description><![CDATA[最近业务需要数字转为中文的数字，本来想直接插件解决的，看了下又没有啥好用的插件。就只有自己写了。这里做一篇技术笔记
由于业务是ejs+jQuery，为了满足业务需求，有些地方写的复杂了，下次使用再优化。
var $=require('jquery')

$(function(){
  let value= numToCN(parseInt($('#countCN').text())+1)
  $('#countCN').text('第'+ value+'集')
})
//数字转换为中文数字
function]]></description><category></category></item><item><title><![CDATA[构造函数、实例、原型、原型链、类class的关系]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/120782607</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/120782607</guid><author>qq_41206305</author><pubDate>Fri, 15 Oct 2021 15:26:44 +0800</pubDate><description><![CDATA[知道了构造函数、实例，学习了原型、原型链，了解了es6的类。是不是还是觉得总是有一点理不清。是的，之前一直没时间理清楚，这里做一篇学习笔记。（学了就忘）
推荐：想必会有人和我一样，问为什么要够着函数和原型，请看这篇。别人写的很清楚了，我就不做搬运工了
看完这篇，真正理解JS面向对象编程思想
类请看这个一万字ES6的class类，再学不懂，请把我锤死（语法篇） 
构造函数和实例
function Person(name,age){
                this.name=name,
       ]]></description><category></category></item><item><title><![CDATA[vue elment-ui选择框select动态加载]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/120371154</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/120371154</guid><author>qq_41206305</author><pubDate>Sat, 18 Sep 2021 17:22:47 +0800</pubDate><description><![CDATA[遇到业务需要下拉选择框动态请求接口数据，element又没有提供动态加载api，就只能自己写了
代码
&lt;template&gt;
    &lt;div&gt;
        &lt;el-select v-model="organization_id"
                   placeholder="请选择"&gt;
            &lt;el-option v-for="(item) in oranizeList"
                       :key]]></description><category></category></item><item><title><![CDATA[十分钟，学会使用js三种方法创建本地json数据文件]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/120043389</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/120043389</guid><author>qq_41206305</author><pubDate>Wed, 01 Sep 2021 17:07:28 +0800</pubDate><description><![CDATA[前言
在干业务时，需要得到一份全国省市到街道的区划数据，刚好业务中连接了高德地图，高德地图又提供了区划的api，这下只需要把数据写到json里了。什么！你说你还不会用js创建json文件？没关系，只需十分钟阅读文章，学会使用js三种方法创建本地json文件！
一、使用html5创建json文件
通过a标签来下载获取到我们创建的json文件。
缺点：必须要下载一次，下载目录不可控，当大量json文件下载时，会储存到同一个文件夹，显的很杂乱。
&lt;script&gt;
//我们写入json文件的内容
let]]></description><category></category></item><item><title><![CDATA[element-ui利用.sync和$attrs,$listener简化封装对话框组件dialog(一次、二次封装）]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/119953554</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/119953554</guid><author>qq_41206305</author><pubDate>Fri, 27 Aug 2021 15:50:26 +0800</pubDate><description><![CDATA[在干业务时，总会遇到需要封装对话框组件。这里总结一下对话框的一次、二次（优雅永不过时！）封装
一次封装
普通封装
对话框：
这里注意不能直接更改props里的值，否则会报错
&lt;template&gt;
  &lt;div&gt;
    &lt;el-dialog title="提示" :visible.sync="dialogVisible" width="30%"&gt;
      &lt;span&gt;内层dialog消息&lt;/span&gt;
      &lt;span slot="]]></description><category></category></item><item><title><![CDATA[vue+element实现鼠标滚轮控制轮播图]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/118940295</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/118940295</guid><author>qq_41206305</author><pubDate>Thu, 19 Aug 2021 11:22:55 +0800</pubDate><description><![CDATA[实现鼠标滚轮控制轮播图：
使用element走马灯:
&lt;template&gt;
  &lt;div class="box"&gt;
  //添加@mousewheel鼠标滚轮事件
    &lt;div style="height: 100%" @mousewheel="rollScroll($event)"&gt;
      &lt;el-carousel
        direction="vertical"
        :autoplay="false"
        trigger]]></description><category></category></item><item><title><![CDATA[听说她还不会组件传值，我连夜为她写了组件传值的七种方式]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/119759449</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/119759449</guid><author>qq_41206305</author><pubDate>Wed, 18 Aug 2021 16:35:11 +0800</pubDate><description><![CDATA[前言
在抽离公共组件时，会遇到很多需要组件传值的地方，特别是封装对话框组件。回想最初只会props、$emit的我在遭遇组件二次封装时越写越复杂，内心万分悲痛。痛心疾首的我熬夜写了这篇文章，帮助你们掌握组件传值的各种花式，玩弄各种业务需求，高强度对线面试官。是的，我心里装的是谁你们都清楚了吧？。
props、$emit
最基础的传值方式，主要用于父子之间，也可以用于爷孙之间（需要父组件做中转）
父子之间
父传子：子组件通过props接收
父组件：
&lt;template&gt;
  &lt;div&gt;]]></description><category></category></item><item><title><![CDATA[（canvas入门案例）vue利用canvas实现在线签名]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/119536340</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/119536340</guid><author>qq_41206305</author><pubDate>Mon, 09 Aug 2021 14:18:40 +0800</pubDate><description><![CDATA[导读
最近看了三心大佬的canvas教程（发现新玩具），canvas真**好玩（优美中国话），附上三心大佬教程
https://juejin.cn/post/6986785259966857247。废话不多说，上正餐
创建canvas标签
&lt;canvas
        ref="saveCanvas"
        width="600"
        height="400"
        @mousedown="ctxDown"
        @mousemove="ctxMove($e]]></description><category></category></item><item><title><![CDATA[vue watch侦听器有无immediate的运行顺序]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/119002719</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/119002719</guid><author>qq_41206305</author><pubDate>Thu, 22 Jul 2021 16:48:58 +0800</pubDate><description><![CDATA[刚写项目的一个需求中遇到了watch运行顺序的坑，本打算把项目弄完再来看看，结果leader说产品还在改需求（高强度学习开始！！&gt;_&gt;）
watch普通监听属性（无immediate）
在初始化时不会执行watch
  created() {
    this.id = 1;
    console.log(this.id);
    console.log(this.name);
  },
  watch: {
    id: function (val) {
        if (val ]]></description><category></category></item><item><title><![CDATA[浅谈vue中watch监听器的触发时机（watch的坑）]]></title><link>https://blog.youkuaiyun.com/qq_41206305/article/details/118997735</link><guid>https://blog.youkuaiyun.com/qq_41206305/article/details/118997735</guid><author>qq_41206305</author><pubDate>Thu, 22 Jul 2021 14:09:55 +0800</pubDate><description><![CDATA[起因
我需要在页面created时获得商家的类型id值，然后监听id值，动态的改变请求接口的地址。请求接口的函数在mounted中执行。业务逻辑写完后发现，页面在第一次加载时，接口没有数据，原因接口地址为空，即接口地址没有改变。
代码
 created() {

    this.typeId = this.$route.params.id;
    console.log("this.typeId的值发生改变，触发watch");

  },
  mounted() {

    console.log(]]></description><category></category></item></channel></rss>