使用的是vue语言，用element的组件，要做一个在线编辑代码，要求输入代码内容，可以进行高亮展示，可以切换各不同语言，而且支持关键字补全，还要有一个各不同版本间的代码左右比较，这就是需求。 至于为什么选中monaco，请查看 vue（element） 中代码高亮插件全面对比 好了，现在正式开工吧！ 首先需要下载monaco-editor组件，monaco-editor-webpack-plug…
在vue开发中，因为引用的父组件和子组件都使用了window.onresize以至于一个window.onresize失效。 解决方案==>可以采用下面的方式 window.onresize = () => this.screenWidth = window.innerWidth // 改为以下写法 window.addEventListener('resize', () => …
Vue2中this.$nextTick的作用和应用场景 1、Vue中概念：异步更新队列 1.1、Vue异步更新DOM的原理： Vue在观察到数据变化时，并不是直接更新DOM，而是开启一个队列，并且缓存同一轮事件循环中的 所有数据改变 。在缓冲时会 除去重复 的操作,等到下一轮事件循环时，才开始更新。 1.2、异步更新队列实现的选择 ： Vue会根据当前浏览器环境优先使用原生的 Promise.th…
vue中发起axios请求 (1)安装axios npm i axios (2)导入并使用axios 存在问题: 每个 组件 中可能都会有发起请求这个需求,那么每个组件中都要导入axios,然后在使用axios调用get或post方法。请求根路径写的还都一样,这样会很麻烦。 解决以上问题的方案: 将 axios 挂载到 Vue原型 上 这样每个子组件都能访问到这个属性了 子组件发起请求只需要 th…
官方推荐使用一种update:my-prop-name 的模式来替代事件触发，目的是为了优雅而不粗鲁的实现父子组件间的双向绑定！先来完成一个小功能：通过父组件按钮将子组件显示出来，如图： 父组件代码： <template> <div> <input type="button" value="我是父组件中的按钮" @click="show"> <child …
一直在学习项目的开发，但是发现忽略了很重要的问题，就是如何根据原型图转换成需要的功能代码，这一块儿感觉有模糊，所以写一篇笔记记录一下，自己的思考开发和已有框架的开发是否有相似或区别。 注意，下面的所有代码段都不是完整的！只根据大概逻辑写重点的部分，详细代码请看 若依框架源码 ！ 目录 1.页面的功能点分析（按钮、导航等调用接口点） 1.1页面及功能点 1.1.1.注册页面 1.1.2.登录页面 1…
一、项目介绍 1.技术要点 html、css3、js、vue基础 2.适合人群 有html、css3、js、vue基础，想学习vue、element ui开发后台管理系统的在校大学生、工作人员； 想学习如何实现动态菜单、动态路由、按钮权限的在职人员； 3.学习收获 1.学会使用vue-admin-template搭建后台系统； 2.vue-admin-template登录源码、权限权限验证流程分析…
前言 在本文中将会用Vue完成九宫格拖拽效果，同时介绍一下网格布局。具体代码以及demo可以点以下超链接进入 效果实例 Demo 简单了解Grid布局(网格布局) 什么是网格布局CSS网格布局(又称“网格”)，是一种二维网格布局系统。CSS在处理网页布局方面一直做的不是很好。一开始我们用的是table(表格)布局，然后用float(浮动)，position(定位)和inline-block(行内块…