;

1.问题描述 ajax请求同源请跨下会携带cookie一旦跨域就没有了cookie

ajax cors跨域携带cookie 2019年4月11日
;

一、DNS解析 登录域名提供商后台,添加二级域名的一条A记录 二、apache配置 路径:/etc/apache2/sites-available/willless.com.conf <VirtualHost *:80> ServerName willless.com ServerAlias blog.willless.com ServerAdmin webmaster@localhost DocumentRoot /var/www/willless/blog ErrorLog ${APACHE_LOG_DIR}/error.log CustomLog ${APACHE_LOG_DIR}/access.log combined </VirtualHost> 多个二级域名,追加以上代码即可 如果willless.com.conf文件为初次创建,文件创建修改好后需要执行命令sudo a2ensite willless.com.conf以启用此配置 三、重启apache sudo service apache2 restart

apache配置二级域名 2019年4月11日
;

dom2事件优点 1.It allows adding more than a single handler for an event. This is particularly useful for DHTML libraries or Mozilla extensions that need to work well even if other libraries/extensions are used. 一个事件可以注册多个监听器 2.It gives you finer-grained control of the phase when the listener gets activated (capturing vs. bubbling) 更精细的手段控制事件监听器的触发阶段 3.It works on any DOM element, not just HTML elements. 对任何dom元素有效不仅仅是html元素 0级DOM分为2个: 一是在标签内写onclick事件 <input id="myButton" type="button" value="Press Me" onclick="alert(‘thanks’);" > 二…

addEventListener和onclick的区别,dom0与dom2 2019年3月29日
;

1.问题描述 404页面本身来源复杂,通过this.$router.go(-1)及this.$router.go(-2)或者history.back()都很难覆盖所有场景, 而且上面的方案很容易导致死循环-上一个页面出错跳到404,返回回去又继续跳到404。 2.问题根源 此时问题关键点,上一个路由到底是什么,此时就需要用到组件内的路由守卫 3.知识点 beforeRouteEnter中无法通过this获取到组件实例,但是可以在回调函数next中访问组件实例 4.相关代码 页面返回上一级按钮绑定back事件 data () { return { fromPathName: ” } }, beforeRouteEnter: (to, from, next) => { next(vm => { vm.fromPathName = from.name }) }, methods: { back: function () { if (this.fromPathName === ‘details’ || this.fromPathName === ‘video’) { this.$router.push({name: ‘library’}) } else { this.$router.push({name: this.fromPathNa…

vue中404页面获取页面来源 2019年3月13日
;

关键点:饼图传入两份数据,一份设置label在外显示,一份在内显示,设置不同信息,位置叠加 /*饼图:项目状态*/ var myChart = echarts.init(document.getElementById(‘echarts-pie’)); // 指定图表的配置项和数据 var option = { title : { text: ‘项目状态’, x:’center’ }, color:[‘#477dea’, ‘#9a9a9a’,’#f2b644′], tooltip : { trigger: ‘item’, formatter: "{a} <br/>{b} : {c} ({d}%)" }, normal:{ show: true, position: ‘inside’, formatter: ‘{d}%’ }, legend: { orient: ‘vertical’, left: ‘left’, data: [‘已签单’,’实施中’,’已完成’] }, series : [ { name: ”, type: ‘pie’, radius: ‘55%’, center: [‘50%’, ‘50%’], data:[ {value:335, name:’已签单’}, {value:310, name:…

echarts饼图同时显示指示线和百分比 2019年3月12日
;

stack相同的数据会在Y轴叠加。 如果是相同的值,则会叠加在一起。取不同的值,Y轴的数据就不会叠加在一起; 或者删除掉,默认为不叠加。

echart折线图不叠加 2019年3月12日
;

title: { text: ‘天气情况统计’, //标题 subtext: ‘虚构数据’, //副标题 left: ‘center’ //标题位置 }, tooltip: { trigger: ‘item’, formatter: "{a} <br/>{b} : {c} ({d}%)" //鼠标移上去显示的内容 }, normal: { show: true, position: ‘inside’, //图形里显示(比如在饼图块上显示百分比) formatter: ‘{d}%’ //显示的内容 }, textStyle: { fontWeight: ‘normal’, //显示字体粗细等 fontSize: 10 }, legend: { //图例 // top: ‘middle’, // bottom: 10, // left: ‘center’, icon: "circle", //圆点形图例(默认是官网上的圆角矩形) itemWidth: 10, //这几个是图例宽高位置等的设置 itemHeight: 10, itemGap: 20, left: 100, top: 110, bottom: 20, textStyle: { // fontSize: 5 color: "…

echart:配置注释 2019年3月12日
;

1.问题描述 父元素设置display:flex,此时两个子元素无论如何设置都会放置在一行中

父元素设置flex后会导致子元素换行失效 2019年3月9日
;

1.原因分析 因为容器在初始化时被设置成display:none; 2.解决方案 元素隐藏通过设置opacity: 0来实现

swiper报错‘Cannot read property ‘indexOf’ of undefined swiper’ 2019年3月9日
;

1,父容器需要设置高度才能生效。

css设置calc不生效 2019年3月9日
;

画布的大小是根据background属性所传的图片尺寸决定的

mcanvas.js中画布大小如何设置 2019年3月8日
;

外层容器添加类名swiper-no-swiping

swiper禁止通过鼠标滑动 2019年3月4日
;

destroyed: function () { // code }

vue中在浏览器后退按钮后执行代码 2019年2月28日
;

1.原因 每次调用都会产生不同的ID,单次调用clearInterval并不能全部清除 2.解决方案 每次调用setInterval后,将ID存入一个数组,然后需要清除时候,遍历数组进行清除 3.相关代码 let id= setInterval(() => {}, 1000) this.idList.push(id) for (let i = 0; i < this.idList.length; i++) { clearInterval(this.timerId[i]) }

setInterval多次调用后,clearInterval无效 2019年2月28日
;

mounted: function () { window.addEventListener(‘scroll’, () => { let scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop if (scrollTop > 60) { // 1 } else { // 2 } }) }

vue中监听scroll事件 2019年2月26日
;

问题原因: name: ‘myFooter’, components: { myFooter } name部分和components部分重名导致,修改不同即可

vue报错:‘RangeError: Maximum call stack size exceeded’ 2019年2月26日
;
三仙归洞 2019年2月24日
;

问题原因: img标签为行内元素(inline),默认对其方式为vertical-align: baseline(基线对齐) 四种解决方法: 1.将img设置为block,这样就不再受行内基线的影响。 2.设置img的竖直对齐方式v-align:bottom。 3.设置父div的font-size,需要一个较大的值,原理未知。 4.设置外层的div的line-height:0,这样基线下方的位置基本可以忽略。

div中包含img标签,下方出现空白 2019年2月21日
;

@-moz-document url-prefix(){ body{color:red;} } supports:https://developer.mozilla.org/en-US/docs/Web/CSS/@supports

针对firefox的css设置 2019年2月18日
;

1.问题描述 直接修改数组某一项的值,数据变化后ui并不跟着变化 2.解决方案,要用到,数组更新检测 错误的代码 setOptionVal: function (index, val) { this.SubjectListData[index].optionIdStringResult = val } 正确的代码 setOptionVal: function (index, val) { let tempVal = this.SubjectListData[index] tempVal.optionIdStringResult = val this.$set(this.SubjectListData, index, tempVal) } 相关链接:https://cn.vuejs.org/v2/guide/list.html#%E6%95%B0%E7%BB%84%E6%9B%B4%E6%96%B0%E6%A3%80%E6%B5%8B

vue数据变化ui不刷新 2019年2月14日
;

1.相关文件 src/App.vue 2.相关代码 <template> <div id="app" class="loading"> <router-view/> </div> </template> mounted: function () { let ele = document.getElementById(‘app’) setTimeout(function () { ele.classList.remove(‘loading’) }, 1500) } #app{ height: 100%; } .loading:before{ content: ”; position: fixed; width: 100%; height: 100%; left:0; top:0; background:#fff url(/static/img/loading.gif) center center no-repeat; z-index: 99999999; }

vue首屏添加loading 2019年2月13日
;

1.实现原理 外层添加容器,设置overflow: hidden; 内部容器,设置overflow-y: scroll; 对内部容器进行偏移,使得滚动条刚好被上层容器遮挡 2.相关代码 <div class="outer"> <div class="inner"></div> </div> .outer{height: 75px;overflow:hidden;} .inner{height: 100%;padding-right: 25px;position: relative;left: 21px;overflow-y: scroll;}

内容区域可滚动,但不显示滚动条 2019年2月13日
;

1.问题描述 轮播处于子组件中,数据通过props从父组件异步获取,父组件中用了async函数 2.问题所在及解决方案 后来发现是因为,data部分list数组中写入了静态的数据,删除后空白轮播消失,但是loop无效 父组件中引用子组件的地方的加入判断v-if="swiperBannerData.length>0",问题消失

vue-awesome-swiper轮播出现空白 2019年2月13日
;

player.on( ‘durationchange’, function( e ) { window.console.log( ‘videoJS: durationchange’ ); }); player.on( ‘ended’, function( e ) { window.console.log( ‘videoJS: ended’ ); }); player.on( ‘error’, function( e ) { window.console.log( ‘videoJS: error’ ); }); player.on( ‘firstplay’, function( e ) { window.console.log( ‘videoJS: firstplay’ ); }); player.on( ‘loadedalldata’, function( e ) { window.console.log( ‘videoJS: loadedalldata’ ); }); player.on( ‘loadeddata’, function( e ) { window.console.log( ‘videoJS: loadeddata’ ); }); player.on( ‘loadedmetadata’, function( e ) { win…

videojs 播放的各个生命周期callback 2019年2月12日