Qin的专栏

百度地图动态绘制台风轨迹

【代码】echarts水球图分享。

canvan绘制跟随鼠标的直线

el-checkbox-group遇到的问题记录原因：vue中给对象新增属性直接用=赋值方式，虽然可以新增属性，但是不会触发视图更新例如定义了temp对象在操作过程中又新增了b属性data () { return { temp: { a: '' } }}//直接赋值不会触发视图更新 this.temp.b= 24可以新增属性，但是不会触发视图更新vue2.0以上可以用 this.$set()更新视图解决办法 .

项目需要前端循环遍历一个接口获取信息，promise可以保证每次接口遍历正常后统一保存返回的数据首先: 封装Promisefn(jsonData,config,index){ return new Promise((resolve, reject) => { upload(jsonData,config).then(res => { if (res.code === 0) {//这里是约定的请求正常情况的返回码 re.

项目开发时遇到问题使用videojs关闭窗口后视频流一直刷新，使用pause暂停无效。视频是在弹窗的时候展示，所以完整解决方案自己琢磨了一下，如下 <div v-html="videohtml"> </div> getVideoDialog() { this.videoVisible = true; this.videohtml = `<video id="videoPlayer" class="video-js" .

最近项目业务需要用到视频流直播。格式M3U8。在此记录一下项目vue版本是2.5.16，先安装必须的插件1.安装yarn add video.jsyarn add videojs-contrib-hls // 这是播放hls流需要的插件yarn add mux.js // 在vue中若不安装它可能报错 "video.js": "^7.11.8", "videojs-contrib-hls": "^5.15.0", "mux.js": "^5.11.0",2.配置videojs.

图片设置属性flex-shrink:0;width:100%;height: 100%;flex-shrink是收缩属性，默认值是1

记录bootstrap slider使用时的问题官网例子 bootstrap slider最近项目遇到一个选择下拉框展示不同值的slider。写的过程中发现实例化silder后再去赋值滚动条的长度就没法改变了**改为每次实例化之前加一个$(“xxx”).slider(‘destroy’);**就ok了，非jquery写法具体可参考官网...

在做微信小程序的时候遇到一个问题，体验版必须打开调试模式才能获取相关数据，且放在正式环境下控件没反应项目里我用的是qy.selectEnterpriseContact 打开企业通讯录会话这个接口前提是先正确获取相关权限，保证sessionkey不过期。然后设置开发和正式环境的合法域名，原因是正式环境和体验版（非调试模式）都会进行域名合法性检测...

bootstrapSwitch 不触发change事件解决方案官网的写法不管用，记录下可用的写法官网写法不管用// 链接: [link](https://www.bootcss.com/p/bootstrap-switch/).$('#mySwitch').on('switch-change', function (e, data) { var $el = $(data.el) , value = data.value; console.log(e, $el, va

DOM库1.elementUI饿了么前端推出的基于 Vue.js 2.0 的后台组件库Github官网2.iviewuiVue.js 的高质量 UI 组件库官网3.vuetify一个为 Vue JS 2.0 打造的 Material 风格的组件库Github官网字体1.vue-svg-icon一个 vue2.0 的可变彩色 svg 图标方案GithubDem...

最近遇到一个需求，深圳罗湖区域要标注出来和其它区域区分出来官网的效果图官网上说v3.0版的jsapi新增了CanvasLayer自定义绘制层，看了下如果是绘制边界的话会很麻烦最后在百度官网上发现了一些比较实用的接口Boundary 和 Polygon使用方法如下： var bdary = new BMap.Boundary(); bdary...

step1：新建一个文件夹svgsvg里新建src文件用来保存要合并的svg文件step2 新建package.jsonpackage.json :{ "devDependencies": { "grunt": "^1.0.1", "grunt-svgstore": "^1.0.0" } }npm install安装依赖包step3 新建Gruntfile.jsmodule.expo...

我们在用echarts做图表时，默认label是一个样式。这里记录下如何修改label样式 label: { normal: { // position: 'inner', fontSize:14, formatter: func...

.parent{ display:table } .child{ display: table-cell; vertical-align: middle; }效果图

&lt;body&gt; &lt;div id="root"&gt; &lt;component :is="type"&gt;&lt;/component&gt; &lt;!-- 等同于下面注释掉的部分 --&gt; &lt;!-- &lt;child1 v-if="type==child1"&gt;

项目引用了velocity.js，下载地址 http://velocityjs.org 。 本文是个学习笔记&amp;amp;lt;body&amp;amp;gt; &amp;amp;lt;div id=&amp;quot;root&amp;quot;&amp;amp;gt; &amp;amp;lt;comp :dis=&amp;quot;show&amp;quot;&amp;amp;

自己在搭建github blog的时候很顺利,一个简易示例地址:https://qinnechen.github.io/ 而在搭建coding private blog的时候遇到一个问题,就是本地预览ok但是放在服务器上样式表不出来 这里记录下这个问题 由于网上搭建教程很多,这里只谈如何解决css这个问题。 这里的关键点是把blog的名字命名为 [你的用户名].codin...

简单总结如下:||遇到true返回 &amp;&amp;遇到false返回 &amp;&amp;优先级高于||举些栗子：alert(1||0)//1alert(0||1||2)//1alert(1&amp;&amp;0)//0alert(1&amp;&amp;0&amp;&amp;2)//0alert(1&amp;&amp;2&amp;&amp;0)//0alert(0

ES5之前JS是没有局部变量的，所以程序员发明了闭包。闭包作用：避免变量被环境污染1.函数作为返回值function F1(){ var a = 100; return function(){ console.log(a) }}var f1 =F1();var a = 200;f1()//100函数作为参数传递functi...

前端开发中免不了遇到跨域问题,总结下跨域的8种方式1.代理 同源策略是针对浏览器端进行的限制，可以通过服务器端来解决该问题2.图片ping或script标签跨域通过图像Ping，浏览器得不到任何具体的数据，但通过侦听load和error事件，它能知道响应是什么时候接收到的。 图像Ping最常用于跟踪用户点页面或动态广告曝光次数。图像Ping有两个主要的缺点，一是只能发送GE...

数组去重ES6 Set 搭配Array.from和…扩展运算符2.利用indexOf正则正则去掉某类字符，比如大写字母，小写字母，数字str.replace(/[0-9]/g,’’) //过滤数字str.replace(/[a-z]/g,’’) //过滤小写字母str.replace(/[A-Z]/g,’’) //过滤大写字母str.replace(...

闭包的由来，为什么要用闭包 由于ES5之前没有块级作用域概念导致例子中我们期望的局部变量 i 被环境污染从而产生错误结果。解决问题要用到IIFE 为什么要用IIFE传统方法定义和执行分开写传统的方法直接污染全局命名空间(浏览器里的 global 对象,如 window)于是有人就想出是否可以这样写： function foo(…){}(); 当然不能，为什么呢？ 因...

使用vue-cli构建的项目 cnpm run build后的文件打不开 这里记录下解决方案 打不开的原因是build后的文件也是需要在服务器上才能运行，自己起一个http server就可以运行了~...

本文是个学习笔记 前言：之前在公司生成了一个自己的私人项目，现在我想在家里programming这个项目，so, how to to it next? 这里做一个记录主要是需要生成本地的SSH公钥使用SSH公钥可以让你在你的电脑和码云通讯的时候使用安全连接（Git的Remote要使用SSH地址）1.在码云个人中心找到SSH 2.找到码云生成SSH教程 链...

vue项目中用到了，这里记录下1.先安装插件 npm install vue-awesome-swiper –save2.全局引用(main.js)import VueAwesomeSwiper from 'vue-awesome-swiper'import 'swiper/dist/css/swiper.css' Vue.use(VueAwesomeSwiper)3...

记录一些常用命令git下载git clone “xxx”查看项目git status上传git add . //把所有文件添加到本地缓冲区git commit -m ‘first commit’git remote add origin git@xxxx/xxx.gitgit push origin master分支git pull 把线上的...

这是一篇总结笔记我们在写vue项目的时候会遇到给组件命名 这里的name非必选项，看起来好像没啥用处，但是实际上这里用处还挺多的 export default { name:'xxx'}1.当项目使用keep-alive时，可搭配组件name进行缓存过滤 举个例子： 我们有个组件命名为detail,其中dom加载完毕后我们在钩子函数mounted中进行数据加...

记录echarts踩坑问题问题：当父组件传值给子组件echarts时，发现子组件获取的props为空，刚开始以为是钩子函数放错了地方，后来发现从mounted和created都不行。当在父组件data定义传递的数据的时候子组件显示正常原因：后来经过排查，发现echarts是在渲染的时候就传递数据解决方案：在父组件定义一个flag，当数据获得的之后再进行子组件的渲染//父组件...

babel是一个转译器,用于把同种语言的高版本规则翻译成低版本规则。过程babel的转译过程分为三个阶段：parsing、transforming、generating;以ES6转ES5为例，具体过程：编写ES6代码 babylon进行解析解析得到ASTplugin用babel-traverse对AST树进行遍历转译得到新的AST树用babel-generato...

最近用ES6的Object.assign踩了个坑,研究记录下；最近有一个项目的功能用到了Object.assign做深拷贝，却发现会出问题。if(xx){//1 this.mon = Object.assign([],obj);}else if(xx){//2 this.tue= Object.assign([],obj);} 第一次只执行1,2条件，this.mon...

这是一篇学习笔记一.父子组件传值&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;父子组件传值&lt;/title&gt; &lt;style&gt; &