Posts

跳转到脚本列表🚀 什么是书签栏的脚本？ 用过油猴脚本自然不会对书签栏脚本感到陌生，与油猴不同的是，书签栏脚本的触发方式是点击书签，而不会自动触发。以下是演示GIF： 使用方式 以Chrome浏览器为例，第一步：右键书签栏，选择添加网页 第二步：在名称处填写脚本名称，网址处填写脚本，最后点击保存即可！ 脚本分享 1.页面自动刷新 功能： 点击之后输入秒数t（未作限制，请输入数字），页面会自动进行 t 秒一次的刷新，无限循环；如果需要停止，再次单击，点击取消或者输入0即可刷新一次自动取消。 javascript: var t=prompt("Time(s)="); var current = location.href; if (t) {setTimeout('reload()', 1000 * t); function reload() { setTimeout('reload()', 1000 * t); var fr4me = '<frameset cols=\'*\'>\n<frame src=\'' + current + '\' />'; fr4me += '</frameset>'; with (document) { write(fr4me); void (close()); }; };}else{location.replace(current);}; 2. Video自动播放 功能：点击之后输入速度t即可实现视频倍速播放，点击取消或者输入0即可恢复1倍速播放。 javascript: var t=prompt("speed = "); if(t){document.getElementsByTagName("video")[0].playbackRate = t*1;}else{document.getElementsByTagName("video")[0].playbackRate = 1;};

关于Vue和VueComponent 一个重要的内置关系:VueComponent.prototype.proto===vue.prototype 为什么要有这个关系？ 让组件实例对象(vc)可以访间到Vue原型上的属性、方法. ref属性 1.被用来给元素或子组件注册引用信息(id的替代者) 2.应用在htm1标签上获取的是真实DOM元素,应用在组件标签上是组件实例对象(vc) 3.使用方式: 打标识: <h1 ref="xxx">.....</h1>或<School ref="xxx"></School> 获取:this.$refs.xxx 配置项props 功能: 让组件接收外部传过来的数据 (1).传递数据: <Demo name="xxx"/> (2).接收数据: 第一种方式(只接收): props:['name'] 第二种方式(限制类型): props:{ name:String } 第三种方式(限制类型、限制必要性、指定默认值): props:{ name:{ type:String,//类型限制 required:true,//必要性 default:"JQF"//默认值 } } 备注: props是只读的,Vue底层会监测你对props的修改,如果进行了修改,就会发出警告, 若业务需求确实需要修改,那么请复制props的内容到data中一份,然后去修改data中的数据. mixin(混入) 功能: 可以把多个组件共用的配置提取成一个混入对象 使用方式: 第一步：定义混合 const mixData={ data(){...} }, const mixMethods= { methods:{...} } 第二步：使用混入 (1).全局混入:Vue.mixin(xxx) (2).局部混入:mixins:[xxx'] 插件 功能:用于增强vue 本质:包含install方法的一个对象,install的第一个参数是vue,第二个以后的参数是插件使用者传递的数据。 定义插件: 对象.install = function (Vue, options) { //1....

Vue中支持的事件 资源事件 事件名称 何时触发 error 资源加载失败时。 abort 正在加载资源已经被中止时。 load 资源及其相关资源已完成加载。 beforeunload window，document 及其资源即将被卸载。 unload 文档或一个依赖资源正在被卸载。 网络事件 事件名称 何时触发 online 浏览器已获得网络访问。 offline 浏览器已失去网络访问。 焦点事件 事件名称 何时触发 focus 元素获得焦点（不会冒泡）。 blur 元素失去焦点（不会冒泡）。 WebSocket 事件 事件名称 何时触发 open WebSocket 连接已建立。 message 通过 WebSocket 接收到一条消息。 error WebSocket 连接异常被关闭（比如有些数据无法发送）。 close WebSocket 连接已关闭。 会话历史事件 事件名称 何时触发 pagehide A session history entry is being traversed from....

重定向后页面回退反复跳转bug 问题 在网易云项目时，由于Api所返回数据的问题，在Video搜索界面出现Mv的结果，这样就导致当点击的视频为Mv时，无法在Video页面利用传入的id参数渲染Video 解决办法 想到利用判断，在得到MV之后跳转到MV播放界面，也即重定向redirect： this.$router.push({ name: 'MvPlay', query: { id: this.id, } }) 但是，这就出现了页面回退之后又前进这样反复的BUG，于是想到replace，修改为： this.$router.replace({ name: 'MvPlay', query: { id: this.id, } }) 这样，在Video页面重定向到Mv页面后，不会留下在Video页面的历史，所以就不会出现上面的BUG了！

在网易云项目时，在歌手详情页点击相似的歌手跳转到query参数不同的另一个歌手详情页时，出现地址栏query参数变化，而页面却没有实时更新的现象，经过搜索找到以下解决方案： 方案一：watch监听路由 watch: { // 方法1 //监听路由是否变化 '$route' (to, from) { if(to.query.id !== from.query.id){ this.id = to.query.id; this.init();//重新加载数据 } } } //方法 2 设置路径变化时的处理函数 watch: { '$route': { handler: 'init', immediate: true } } 方案二：给router-view添加一个不同的key 给router-view添加一个不同的key，这样即使是公用组件，只要url变化了，就一定会重新创建这个组件。 <router-view :key="$route.fullpath"></router-view> 小洁🙎🏼‍♀️ 抽象问题描述：同一path的页面跳转时路由参数变化，但是组件没有对应的更新。 实际原因：主要是因为获取参数写在了created或者mounted路由钩子函数中，路由参数变化的时候，这个生命周期不会重新执行。

《聪明人和傻子和奴才》 这篇散文诗作于1925年12月26日，鲁迅最初将其发表于1926年1月4日《语丝》周刊第60期。 奴才总不过是寻人诉苦。只要这样，也只能这样。有一日，他遇到一个聪明人。 “先生！”他悲哀地说，眼泪联成一线，就从眼角上直流下来。“你知道的。我所过的简直不是人的生活。吃的是一天未必有一餐，这一餐又不过是高粱皮，连猪狗都不要吃的，尚且只有一小碗……” “这实在令人同情。”聪明人也惨然说。 “可不是么！”他高兴了。“可是做工是昼夜无休息的：清早担水晚烧饭，上午跑街夜磨面，晴洗衣裳雨张伞，冬烧汽炉夏打扇。半夜要煨银耳，侍候主人耍钱；头钱从来没分，有时还挨皮鞭……。” “唉唉……”聪明人叹息着，眼圈有些发红，似乎要下泪。 “先生！我这样是敷衍不下去的。我总得另外想法子。可是什么法子呢？……” “我想，你总会好起来……” “是么？但愿如此。可是我对先生诉了冤苦，又得你的同情和慰安，已经舒坦得不少了。可见天理没有灭绝……” 但是，不几日，他又不平起来了，仍然寻人去诉苦。 “先生！”他流着眼泪说，“你知道的。我住的简直比猪窠还不如。主人并不将我当人；他对他的叭儿狗还要好到几万倍……” “混帐！”那人大叫起来，使他吃惊了。那人是一个傻子。 “先生，我住的只是一间破小屋，又湿，又阴，满是臭虫，睡下去就咬得真可以。秽气冲着鼻子，四面又没有一个窗……。” “你不会要你的主人开一个窗的么？” “这怎么行？……” “那么，你带我去看去！” 傻子跟奴才到他屋外，动手就砸那泥墙。 “先生！你干什么？”他大惊地说。 “我给你打开一个窗洞来。” “这不行！主人要骂的！” “管他呢！”他仍然砸。 “人来呀！强盗在毁咱们的屋子了！快来呀！迟一点可要打出窟窿来了！……”他哭嚷着，在地上团团地打滚。 一群奴才都出来了，将傻子赶走。 听到了喊声，慢慢地最后出来的是主人。 “有强盗要来毁咱们的屋子，我首先叫喊起来，大家一同把他赶走了。”他恭敬而得胜地说。 “你不错。”主人这样夸奖他。 这一天就来了许多慰问的人，聪明人也在内。 “先生。这回因为我有功，主人夸奖了我了。你先前说我总会好起来，实在是有先见之明……。”他大有希望似的高兴地说。 “可不是么……”聪明人也代为高兴似的回答他。