VUE
文章平均质量分 79
分享和记录vue开发和学习中总结的知识和困难!
mingyong.g
Hello world!
展开
-
无界微前端项目实战
微前端框架:无界 wujievue微前端是什么 | 无界主应用:Vue 2 + elementui子应用:Vue 3+vite+element plus。原创 2024-04-30 13:20:32 · 977 阅读 · 0 评论 -
Vue2 如何优雅的解决v-for和v-if同时出现
本文通过伪代码的形式,介绍了Vue 2项目中解决v-for和v-if冲突的两种方案,具体使用何种方法需要视业务需求和数据结构而定。原创 2022-08-03 20:06:00 · 1355 阅读 · 0 评论 -
【长文分享】- Vue 源码学习笔记分享
写在前面前端时间给大家分享了一篇开源文档 《 Vue 源码分析与讲解 》,详情请戳:[ 资料分享 ] Vue 源码分析与讲解 - 附下载地址这段时间我也是把文档和配套的课程学习了一遍,对Vue的原理有了更深层次的理解,由于原文档中涉及大量的源代码以及实现逻辑分享,不易于阅读和事后查阅,因此我在阅读的过程中对一些关键性的内容做了标记和整理,现将整理的笔记再次分享给大家。由于文章是通过 wolai 导出为 md,导致部分格式和样式丢失,为了更好的阅读体验,可访问下方原文链接。Flow认识 FlowFl原创 2022-03-14 19:08:35 · 2039 阅读 · 0 评论 -
[ 资料分享 ] Vue 源码分析与讲解 - 附下载地址
✍️ 写在前面已经很长时间没有更文了,最近也确实有许多工作上的事情要处理。这里给大家分享一篇介绍和分析Vue源码的电子书,这本电子书是我春节期间学习的 《Vue.js 源码揭秘》视频课程的辅助教材。电子书自身是开源的,所以在这里分享给大家。目前社区有很多 Vue.js 的源码解析文章,但是质量层次不齐,不够系统和全面,这本电子书的目标是全方位细致深度解析 Vue.js 的实现原理,让同学们可以彻底掌握 Vue.js。目前分析的版本是 Vue.js 的最新版本 Vue.js 2.5.17-beta.0,并且之原创 2022-02-25 04:15:58 · 972 阅读 · 0 评论 -
Vue cli3 中全局引入scss文件
写在前面近期把之前写的一个Vue老项目进行了一番重构,发现其中有许多重复使用的css样式代码,决定把重复使用的样式代码提取到公共的scss文件中,并全局使用,本来以为是一个比较简单的工作,但是在操作的过程中,还是碰到了不少问题。这里简单记录下,并分享给有需要的人,希望对大家有所帮助。方法 1步骤 1:根目录新建 vue.config.js 文件步骤 2:将下述代码添加到 vue.config.js 文件中module.exports = { css: { 原创 2021-12-28 23:34:46 · 2417 阅读 · 0 评论 -
通过Cli方式创建uni-app常见错误整理
通过Cli方式创建uni-app常见错误整理文章目录通过Cli方式创建uni-app常见错误整理写在前面错误一 :exports is not not defined错误二:this.getResolve is not a function错误三:全局配置Vue.config.ignoreElements 后报 uni-* 组件未定义写在前面最近将cli版本的uni-app更新到了最新版本,结果更新后引发了一些新的问题,为避免后续再犯同样的错误,特以文字记录。推荐访问我在我来的个人笔记,以获得更原创 2021-03-01 18:54:44 · 1371 阅读 · 0 评论 -
Vue 2.0 官网 API 零碎知识整理
Vue API 零碎知识整理最近抽空重新看了一遍Vue官网的API,对一些经常使用的、经常忘记用法的、经常错用的API进行了梳理,并以个人学习笔记的形式记录,以降低再次阅读的成本和提高查阅文档的效率写在前面为获得最佳的阅读体验,可访问本人笔记原文地址 Vue API碎片知识整理ignoredElementsvue.config 配置忽略在Vue 之外的自定义元素,如微信的开放标签 wx-open-tag; 否则会报组件未注册的警告data组件data 必须返回一个函原创 2021-01-27 19:57:40 · 963 阅读 · 0 评论 -
解决Invalid handler for event “click“:问题
解决Invalid handler for event "click":问题上一篇文章介绍了如何搭建一个基于vue和ElementUi 的项目,当我在项目中添加 一个button按钮,并未这个按钮添加一个@click事件 <el-button type="primary" icon="el-icon-edit" circle @click="addNew" ></...原创 2019-03-28 21:15:24 · 43876 阅读 · 31 评论 -
前端热门图书推荐,含个人心得体会与阅读顺序指南
前端热门图书推荐,含个人心得体会与阅读顺序指南写在前面 作者非科班出身,本科学的是自动化专业,平时也能接触一些计算机编程方面的知识,因而对编程比较感兴趣。工作后正好赶上团队调整,采用主流的前后端分离的路线,作为新人被安排到了前端岗位,也是团队的第一批纯前端开发人员。刚进入部门时,很多老一辈开发人员前端用的是jquery,后来前后端分离之后,要求我们这批新人使用Vue构建前端页面,所以我们这批前端基本靠自学,在过原创 2020-12-21 19:46:14 · 1421 阅读 · 4 评论 -
Vue业务组件设计思想: 巧用slot插槽实现UI和业务解耦
Vue组件设计思想: 巧用slot插槽实现UI和业务解耦写在前面本文主要分享笔者在组件设计和重构过程中总结的经验技巧,核心内容是分享Vue组解耦设计的编程思想,而非高大上的前沿技术,和组件的高级实现。技术/知识核心vue / slot插槽本文通过使用slot实现vue组件的解耦设计,因此在阅读本文之前,最好有Vue.js开发经验和slot插槽使用经验。当然这不是必须的,正如前面所说,本文主要是分享如何使用slot实现组件UI样式和业务逻辑的解耦,核心在于解耦的思想。正文首先介绍一下本文原创 2020-11-20 19:29:51 · 1424 阅读 · 1 评论 -
VSCode开发UNI-APP 配置教程、注意事项与插件推荐
VSCode开发UNI-APP 配置教程、注意事项与插件推荐写在前面uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。 开发UNI-APP最好的工具是HbuilderX,但这并不打脸为什么要在VsCode中开发UNI-APP,用官方的话来说HBuilderX是专为Vue打造的编辑器,那么非Vue又该怎么办呢?这时就不得不对选择其它产品,那么为什么不将U原创 2020-10-22 16:09:35 · 28109 阅读 · 9 评论 -
【Bug日志】Vue computed 报错:Computed property was assigned to but it has no setter 错误原因分析与解决办法
【Bug日志】Vue computed 报错:Computed property was assigned to but it has no setter 错误原因分析与解决办法错误描述最近在封装Vue组件时,借助Vue的Computed属性监听父组件传递到子组件的数据,但是开发调试过程中控制台取提示Computed property was assigned to but it has no setter 错误。控制台报错如下:错误分析根据控制台错误提示,组件中定义的computed属性缺少se原创 2020-10-14 16:01:45 · 11677 阅读 · 0 评论 -
基于 Vue+Element 美化SwaggerUI
基于 Vue+Element 美化SwaggerUI写在前面本项目基于think-swagger-ui-vuele进行改造和升级,主要是修复了原项目中一些已知bug以及部分由 swagger JSON 数据不规范导致的错误,新增了部分快捷操作功能,提高使用者体验,以及改造了整个界面的风格,使其看起来更像elementUI.(这个纯属个人喜好,原作者的风格看着也挺好的,只是个人感觉灰棕色有点压抑)原 think-swagger-ui-vuele 的体验地址:????demo作者改造后的体验地址:??原创 2020-09-28 18:07:39 · 1854 阅读 · 0 评论 -
VUE项目取消Eslint校验
VUE项目取消Eslint校验为了保证代码风格的一致性,通常在项目中集成Eslint 用作规则检查。但是在开发调试的时候,过多的Eslint 警告,常常给调试产生干扰,影响体验。因此在前期开发调试,尤其是debug的时候,我们可以暂时取消Eslint检验,毕竟让代码“跑起来”是开发者的第一要务!直接注释掉Eslint 规则在编辑器中搜索“createLintingRule”进入webpack.base.conf.js注释掉Eslint规则同时需要将有关createLintingRule原创 2020-09-25 12:43:23 · 2729 阅读 · 0 评论 -
UNI-APP/VUE 项目集成 微信SDK /微信开放标签 教程和避坑指南(下)——微信开放标签篇
UNI-APP/VUE 项目集成 微信开放标签 教程和避坑指南 文章同步发布于????前端知识营地,移动端用户可通过????????手机端查看以获得更佳的阅读体验和排版效果手机端访问地址:UNI-APP/VUE 项目集成 微信开放标签 教程和避坑指南前言上一篇文章里详细介绍了UNI-APP/VUE项目如何集成微信的SDK,如果有需要在UNI-APP集成微信SDK的朋友,可以点击下方链接访问。????UNI-APP/VUE 项目集成微信SDK教程和避坑指南本文接着UNI-APP/VUE原创 2020-09-12 19:28:35 · 1498 阅读 · 0 评论 -
UNI-APP/VUE 项目集成 微信SDK /微信开放标签 教程和避坑指南
UNI-APP/VUE 项目集成微信SDK教程和避坑指南 文章同步发布于????前端知识营地,移动端用户可通过????????手机端查看以获得更佳的阅读体验和排版效果 前言本文主要介绍在UNI-APP项目中集成 微信SDK / 微信开放标签 。由于UNI-APP是对Vue 的二次封装,因此本教程也适用与Vue项目。本项目是基于已经认证的微信服务号(是服务号不是微信公众号/订阅号)进行开发,根据官方文档微信公众号也是可以集成SDK的,但是微信开放标签,目前主要是跳转到小程序和跳转到APP原创 2020-09-09 23:14:51 · 2677 阅读 · 0 评论 -
10 秒 到 2秒 超简单的Vue项目首屏优化实践
10 秒 到 2秒 超简单的Vue项目首屏优化实践摘要性能优化是一个比较大的知识点,包含但不限于性能优化的工具,技术手段和流程,本文主要从压缩文件体积,减少请求次数方面入手,优化Vue项目的首屏加载时间,实现首屏加载10秒到2秒的提升。主要技术栈如下:Vue cli3 Element UI首屏优化Vue 是典型的单页应用,首次加载耗时多,因此优化Vue项目首屏加载对于提升用户体验非常重要。下图展示了一个糟糕的首屏加载案列,白屏时间长达10余秒,简直让人无法忍受!如何优化方法一:原创 2020-09-05 14:56:42 · 1174 阅读 · 0 评论 -
Vue+Element UI开发后台管理系统之动态路由相关问题总结
Vue+Element UI 开发后台管理系统之动态路由相关问题总结摘要 这段时间一直在搭建移动端APP基础信息管理的PC端后台管理系统,主要功能含 人员基础信息维护 / 人员组织维护 / 人员权限管理 / APP应用数据导入导出 等。由于项目刚上线,正好抽出半天空闲时间(主要还是因为今天刚好是周末????)将开发中遇到的一些问题作个简要的归纳和总结。 &nb原创 2020-08-01 16:19:42 · 752 阅读 · 0 评论 -
UNI-APP转华为welink小程序实战
UNI-APP转华为welink微码小程序实战 uni-app自2018年初发布以来,一直蓬勃发展,一派欣欣向荣,社区也是人声鼎沸,众望所归。根据官方介绍,基于uni-app 开发可以轻松实现一套代码发布到10个平台。随着小程序生态的不断发展,华为基于自家的welink平台(对标阿里的钉钉和腾讯的企业微信)推出了自己的小程序产品:微码小程序,由于发行时间较晚并没有被uni-app集成到统一开发平台下。那么原创 2020-07-19 14:06:46 · 2520 阅读 · 2 评论 -
Vue项目打包部署到GitHub Pages
Vue项目打包部署到GitHub Pages前言关于什么是github pages?怎样创建github 仓库上传本地项目到GitHub远程仓库?等基本操作本文不再赘述,初学者可以通过搜索找到大量文章教程。本文重点在于:如何将vue项目源码(含dist目录)同步到到github仓库,同时单独将项目下的dist目录同步到gh-pages分支以便使用GitHub pages 发布和预览静态网页。上述问题,作者以往的做法是将Vue项目源码托管到源码仓库,然后另外创建一个webpage仓库管理前期原创 2020-07-04 21:49:14 · 5934 阅读 · 4 评论 -
【Bug日记】Element-UI级联选择器el-cascader报错Cannot read property level of null
????【Bug日记】 Element-UI级联选择器el-cascader报错Cannot read property level of null????问题描述使用element-ui 级联选择器el-cascader,其数据源options需要根据用户操作·动态切换·,此时若没有进行级联选择操作,动态切换options不会产生错误,一旦用户进行了级联选择,那么下一次切换options数据源时便会报错TypeError: Cannot read property 'level' of null*原创 2020-06-20 16:14:02 · 3393 阅读 · 3 评论 -
【Bug日记】POST请求,后台无法获取到参数
【Bug日记】POST请求,后台无法获取到参数郁闷!前端时间刚针对POST请求常见错误做了个总结,今天在前后端接口对接中又遇到了POST请求相关问题!????问题描述前端调用后端POST接口,向后台提交一个字符串数据,结果接口一直返回参数格式不正确,打开调试才知道参数未能被后端正确解析。然而后端本地调试一切正常,看来锅在前端无疑了。????问题定位后端接受JSON格式参数,然而 抓取axios POST请求发现Content-Type为application/x-www-form-urlenc原创 2020-06-05 00:00:05 · 2197 阅读 · 5 评论 -
Vue知识回顾与总结【四】vm.$set和vm.$delete
Vue知识回顾与总结【四】vm.$set用法回顾vm.$set()相信使用vue的人都不陌生,主要用于解决对象新增属性,删除属性时数据无法侦测问题,以及通过索引操作数组元素数据无法侦测的问题。用法如下:vm.$set( target,key ,value )实现原理在Vue.js的原型上设置$set属性,所有以**vm.$**开头的方法都是在Vue.js的原型中实现的。处理数组...原创 2020-04-18 13:27:52 · 475 阅读 · 0 评论 -
Vue知识回顾与总结【三】vm.$watch
文章目录Vue知识回顾与总结【三】vm.$watchvm.$watch用法回顾vm.$watch 原理Vue知识回顾与总结【三】vm.$watchvm.$watch用法回顾vm.$watch用于观察一个表达式或者computed属性在vue.js实例上的变化。其用法如下:vm.$watch( expOrFn , callback,[option] )第一个参数expOrFn是需要...原创 2020-04-18 11:55:09 · 367 阅读 · 0 评论 -
Vue知识回顾与总结【二】
Vue知识回顾与总结【二】第二章 Vue如何实现数组的变化侦测写在前面 今天是一个特殊的日子,在此向所有逆行者致敬,向所有牺牲者致哀!!!Vue数组的变化侦测为什么和对象不同? 首先我们思考这样一个问题,为什么在Vue中数组的...原创 2020-04-04 13:05:45 · 144 阅读 · 0 评论 -
Vue中使用getElementById结果返回元素为null ?
【记一次粗心Bug】 Vue中使用getElementById结果返回元素为null ?文章目录【记一次粗心Bug】 Vue中使用getElementById结果返回元素为null ?在created()中使用getElementByIdmounted()中使用getElementByIdcreated()中结合this.$nextTick()实现业务需求总结首先,我在项目中用这样一个需求,...原创 2020-03-31 18:23:24 · 22466 阅读 · 0 评论 -
Vue知识回顾与总结
Vue知识总结与回顾@[TOC](Vue知识总结与回顾)Vue知识总结与回顾第一章 Vue的响应样式原理写在前面Object.definePropertyVue中的依赖Vue知识总结与回顾第一章 Vue的响应样式原理写在前面工作之余,利用个人时间刷了一遍《深入浅出Vue.js》,书中对Vue的源码做了详细的分析和讲解,读完此书结合自己最近使用Vue开发的经历以及开发过程中碰到的一些困惑和B...原创 2020-03-31 13:02:32 · 258 阅读 · 0 评论 -
Vue过滤器的几种用法
Vue过滤器的几种用法本文主要介绍Vue项目中filter的几种用法。一. 单独在组件或者是页面中使用单独在页面或者是组件中使用vue filter比较简单,主要是用在{{ }} 和v-bind指令中。简单的代码示例如下:<!-- 在代码中使用 --><view v-bind:value = "val|getVal">{{val|getVal}}</vi...原创 2020-03-01 16:23:15 · 1024 阅读 · 0 评论