vue

// 拖拽自定义指令添加 Vue.directive('drag', { bind(el){ let disX = 0; let disY = 0; let isDragStart = false; el.addEventListener('mousedown', e => { disX = e.clientX - el.offsetLeft; disY = e.clientY - el.o…

前言 闭包这个东西，不仅对于ES（ECMAScript）语言的初学者来说是很难理解的一个东西，而且对于许多做了很多项目的“老手”来说，可能也会栽跟头。 而节流和防抖这两个极具应用价值的闭包实现，更是容易让人云里雾里，网上容易找到的节流和防抖函数，如果不能深入理解，也是很难移植到自己的项目中的。 而我写这篇博客的原因，就是因为一个和我同期的“老手”在这里栽了个大跟头。 由于此问题在vue上产生，我就…

Vue 使用 localStorage储存信息 首先说一下cookies sessionStorage和localstorage三者的区别 相同点： 都存储在客户端 不同点： 存储大小： cookie 数据大小不能超过 4k 。 sessionStorage 和 localStorage 。虽然也有存储大小的限制，但比 cookie 大得多，可以达到 5M或更大 。 有效时间： localStor…

在文档页面( http://localhost:8080/document )拉动滚动条，然后刷新浏览器会发现滚动条依然在原来的位置，这是浏览器的默认行为，会记录浏览器滚动条默认位置。 但是点击浏览器“前进/后退”按钮，会发现当初那个页面的滚动条从0开始了，没有记录上一次滚动条的位置。现在要求点击浏览器“前进/后退”按钮，页面滚动条要记录上一次的位置，这时需要设置它的的滚动行为。 这时候需要在路由…

运行Vue项目时在终端报了一个警告：“start value has mixed support, consider using flex-start instead” 解决方法： 找到使用了flex布局样式的选择器，将“start”换成“flex-start”，即可消除警告 版权声明：本文为ACM_THORN原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。原文…

直接上代码啦 body中 <div id="app"> <input type="number" v-model.number="arr2[0]"><br /> <input type="number" v-model.number="arr2[1]"><br /> <input type="number" v-model.numb…

demo实现效果： 对MongoDB的增删改查，表单验证，可编辑的table 用到的技术: iview （前端框架，不是重点，本demo只用了可编辑的table） Nuxt.js (服务器端渲染，浏览器右键查看源码会有html，便于SEO优化) Koa2 （个人感觉如果vue文件相当于*.html文件，那koa2就相当于java后台程序，在vue页面写ajax请求，发送给koa,koa接收后去操作…

项目场景： vue开发的项目，既有移动端又有pc端，但是移动端和pc端展示的内容不一样，同一个组件样式也不一样，移动端展示内容比pc端少，那这个时候在一个项目种怎么做的？ 解决方式： 路由写两份，一份移动端的，一份pc端的，这两份路由地址相同，对应的组件不同，在路由的入口文件里去判断渲染pc的路由还是移动端的路由 代码如下： router下的index.js文件 import Vue from '…

// getters const getters = { netStatusMonitorData: state => { return state.faultInfo; }, }; const mutations = { [baseTypes.UPDATE_DATA_MODULE](state) { //oldcode //state.faultInfo = pageData.dataSo…

const list = [ {id: 1, name: '中国', value: 10, pid: ''}, {id: 2, name: '北京', value: 9, pid: 1}, {id: 3, name: '上海', value: 8, pid: 1}, {id: 4, name: '陕西', value: 7, pid: 1}, {id: 5, name: '河北', value: …