<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[hsCBY的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/hsCBY</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; hsCBY]]></copyright><item><title><![CDATA[vue2.0 @contextmenu 右键点击事件]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/114633164</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/114633164</guid><author>hsCBY</author><pubDate>Wed, 10 Mar 2021 13:40:02 +0800</pubDate><description><![CDATA[&lt;div @contextmenu.prevent="openMenu($event)"&gt; 右键点我 &lt;/div&gt;

&lt;!-- 右键弹出菜单设置 --&gt;
&lt;ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"&gt;
  &lt;li &gt;刷新&lt;/li&gt;
  &lt;li &gt;关闭&lt;/li&gt; 
  &lt;li &gt;关闭其他&l]]></description><category></category></item><item><title><![CDATA[在vue中使用svg图标]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102935865</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102935865</guid><author>hsCBY</author><pubDate>Wed, 06 Nov 2019 15:29:31 +0800</pubDate><description><![CDATA[以下为傻瓜式教程，亲测有效，不行请联系博主
首先：
下载 svg-sprite-loader
命令：npm i svg-sprite-loader -S
其次
配置vue.config.js ( vue-cli3 )这里只讲vue-cli3的配置
//这里注意路径问题,跟后面创建的文件位置有关
const path = require('path')
function resolve (dir) ...]]></description><category></category></item><item><title><![CDATA[语言国际化]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102580827</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102580827</guid><author>hsCBY</author><pubDate>Wed, 16 Oct 2019 10:31:52 +0800</pubDate><description><![CDATA[下载npm i vue-i18n -S
在main中导入
import Vuei18n from 'vue-i18n'
Vue.use(Vuei18n)
//这里只做两个demo文件，想要其他语言，照猫画虎就行
const i18n = new VueI18n({
  locale: "zh",
  messages: {
    "zh": require('@/languages/zh.jso...]]></description><category></category></item><item><title><![CDATA[vue导出表格]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102553347</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102553347</guid><author>hsCBY</author><pubDate>Mon, 14 Oct 2019 17:58:05 +0800</pubDate><description><![CDATA[下载
cnpm install  file-saver
cnpm install xlsx -S
cnpm install script-loader -D
//导出表格的方法
ExportXlsx(state, list) {
    console.log(list)
    //这里导入的是 Export2Excel.js文件路径
    import('@/vendor/Export2Ex...]]></description><category></category></item><item><title><![CDATA[vue上传图片到阿里云]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102553295</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102553295</guid><author>hsCBY</author><pubDate>Mon, 14 Oct 2019 17:51:48 +0800</pubDate><description><![CDATA[下载 ali-oss
npm i ali-oss -S
在vue中使用
在main中导入
import oss from ‘ali-oss’
window.oss = oss
在方法中使用:
//这里的四个参数都是后端给的
var client = new oss({
    region: "",
    //云账号AccessKey有所有API访问权限，建议遵循阿里云安全最佳实践，部署在服务端...]]></description><category></category></item><item><title><![CDATA[一键复制黏贴]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102553230</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102553230</guid><author>hsCBY</author><pubDate>Mon, 14 Oct 2019 17:49:43 +0800</pubDate><description><![CDATA[方法一： 原生js  不兼容ios，这里不详细写了，有需要请百度其他文章
DOM.select()
document.execCommand("copy"); 

方法二：
使用 clipboard 插件
下载 npm i clipboard -S
在要使用的文件中导入
import clipboard from ‘clipboard’
html部分：
&lt;input type="text" ...]]></description><category></category></item><item><title><![CDATA[使用html2canvas生成海报]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102553130</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102553130</guid><author>hsCBY</author><pubDate>Mon, 14 Oct 2019 17:44:11 +0800</pubDate><description><![CDATA[下载 npm i html2canvas -s
导入 import html2canvas from ‘html2canvas’
//第一个参数是盒子容器
html2canvas(document.body,{
    //设置海报的大小和宽度
    height: document.body.offsetHeight+50,
    width: document.body.offsetWid...]]></description><category></category></item><item><title><![CDATA[vue使用QRCode.js制作二维码]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/102552993</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/102552993</guid><author>hsCBY</author><pubDate>Mon, 14 Oct 2019 17:40:45 +0800</pubDate><description><![CDATA[安装 npm install qrcodejs2 --save
页面使用 import QRCode from “qrcodejs2”; // 引入qrcode
制作一个盛放二维码的容器
 &lt;div id="qrcode"&gt;&lt;/div&gt;

生成二维码
//获取容器
document.getElementById("qrcode").innerHTML = "";
let q...]]></description><category></category></item><item><title><![CDATA[深拷贝和浅拷贝]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100553861</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100553861</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 11:23:14 +0800</pubDate><description><![CDATA[浅拷贝是是复制一个对象的属性和方法，类似地址复制
案例:
function copy(obj1,obj2){
    for(key in obj1) {
        obj2[key] = obj1[key];
    }
}
obj1 = {
    age: 5,
    name: "name"
}
obj2 = {};
copy(obj1,obj2);
console.dir(obj...]]></description><category></category></item><item><title><![CDATA[javaScript中的this指向]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100553692</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100553692</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:53:30 +0800</pubDate><description><![CDATA[1.函数中this的指向，与函数声明无关，与函数调用有关
2.如果函数是通过对象调用，那么函数内部this就是该对象(谁调用函数，this就是谁):否则this指向window
3.构造函数中的this,指向每次创建的对象
*普通函数中的this是谁?-----window
案例:
function f1() {
console.log(this);
}
f1();



对象.方法中的this是...]]></description><category></category></item><item><title><![CDATA[js常用内置对象]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100553224</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100553224</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:51:31 +0800</pubDate><description><![CDATA[常用的内置对象
Math
1).Math

Math.abs()
-Math.abs(x): 返回x的绝对值
-console.log(Math.abs(“1”));       1
-console.log(Math.abs(-1));       1
-console.log(Math.abs(“你好”));    NaN
-console.log(Math.abs(undefined)); ...]]></description><category></category></item><item><title><![CDATA[jQuery的动画函数]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100553136</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100553136</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:35:55 +0800</pubDate><description><![CDATA[显示隐藏:
1.show([speed],[easing],[fn]) 显示元素， speed为速度，easing切换效果(先快后慢)，fn回调函数，当全部隐藏后执行fn，它们都可以省略
2.hide([speed],[easing],[fn]) 隐藏元素
3.toggle([speed],[easing],[fn]) 切换显示/隐藏，隐藏调用时显示，显示调用时隐藏
//一般情况下都不加参数
滑动...]]></description><category></category></item><item><title><![CDATA[jQuery事件]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100552994</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100552994</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:32:39 +0800</pubDate><description><![CDATA[单个事件注册:
$("div").click(function(){});

多个事件注册:
1.on()方法在匹配元素上绑定一个或多个事件,并且可以注册jQuery没封装的事件（例如 input）
$("div").on({
    mouseenter: function(){},
    click: function(){}
});

如果注册事件处理的方法相同则可以使用下面这种方法:
$...]]></description><category></category></item><item><title><![CDATA[localStorage和sessionStorage]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100552932</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100552932</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:27:05 +0800</pubDate><description><![CDATA[sessionStorage: 数据保存在浏览器中，网页关闭删除存储的数据，不同网页不可以共享数据，除非这个网页是由上一个网页打开的，存储空间为5MB左右
1.生命周期为关闭浏览器窗口
2.在同一个窗口(页面)下数据可以共享
3.以键值对的形式存储使用
语法:
存储数据: sessionStorage.setItem(key,value);
获取数据: sessionStorage.getItem...]]></description><category></category></item><item><title><![CDATA[fetch和axios]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100552710</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100552710</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:23:18 +0800</pubDate><description><![CDATA[1.前后端交互模式
***原生ajax
***基于jQuery的ajax
***fetch
***axios
2.URL的地址格式
（1）传统地址格式: 协议://域名(或者id地址):端口(默认为80端口，可以省略)/路径?参数#锚点(用来定位页面中的某个位置)
例:
http://ithema:80
http://ithema:80/index.html
http://ithema:80/in...]]></description><category></category></item><item><title><![CDATA[vue 路由]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100552402</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100552402</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:16:27 +0800</pubDate><description><![CDATA[1.后端路由
概念：根据不同的url用户请求，返回不同的内容
本质: URL请求地址和服务器资源的对应关系
*后端渲染，就是在后端先将字符串模板拼接好以后再返回到前端(存在性能问题)
*Ajax前端渲染 (前端渲染提高性能，但是不知此前进和后退操作)
*SPA(Single Page Application) 单页面应用程序,整个网站只有一个页面，内容的变化通过AJax局部更新实现，同时支持浏览器...]]></description><category></category></item><item><title><![CDATA[重绘和回流]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100551892</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100551892</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 10:01:48 +0800</pubDate><description><![CDATA[浏览器的渲染过程
首先我们简单的介绍一下浏览器的渲染过程：


浏览器会将 html代码解析成一个 Dom 树(Dom tree),html中的每个标签(tag)都是 Dom tree中的一个节点，根节点就是document对象， Dom tree 中包含了所有的html标签 其中有 display: none 隐藏元素和js动态添加的元素等


浏览器把所有样式(主要包括css和浏览器的样式设置...]]></description><category></category></item><item><title><![CDATA[vue里面使用quill-editor富文本编辑器]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100551768</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100551768</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 09:42:18 +0800</pubDate><description><![CDATA[在vue里面使用quill-editor富文本编辑器
这里默认大家已经把项目框架都搭建完毕，直接说明怎么使用
下载：
npm install -s vue-quill-editor
npm install quill
在main.js( 项目入口文件 )中进行引入
import VueQuillEditor from 'vue-quill-editor'
//加载css样式资源，必不可少
impo...]]></description><category></category></item><item><title><![CDATA[防抖和节流]]></title><link>https://blog.youkuaiyun.com/hsCBY/article/details/100551320</link><guid>https://blog.youkuaiyun.com/hsCBY/article/details/100551320</guid><author>hsCBY</author><pubDate>Thu, 05 Sep 2019 09:29:35 +0800</pubDate><description><![CDATA[防抖和节流
防抖（debounce）
所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。
非立即执行防抖
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;

&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewp...]]></description><category></category></item></channel></rss>