- 一、前言在前端项目开发过程中，el-table展示的结果列使用组件形式引入，其中某些字段通过:formatter方法转码，结果栏位的字段显示/隐藏控制也使用组件形式引入，前端在控制字段显示属性时，发现码值转换及字段信息展示均有问题。 二、问题分析通过阅读代码结构，发现el-table-column通过template循环生成，由于template的作用是模板占位符，可帮助我们包裹元素，但在... 一、前言在前端项目开发过程中，el-table展示的结果列使用组件形式引入，其中某些字段通过:formatter方法转码，结果栏位的字段显示/隐藏控制也使用组件形式引入，前端在控制字段显示属性时，发现码值转换及字段信息展示均有问题。 二、问题分析通过阅读代码结构，发现el-table-column通过template循环生成，由于template的作用是模板占位符，可帮助我们包裹元素，但在...
- 一、key 的作用作为一个DOM节点的标识值，结合Diff算法可实现对节点的复用。(key相同的节点会被复用。)只有当key(或其他导致isSameNode判断为false)发生改变时，才会触发节点的重新渲染。否则Vue将会复用之前的节点，通过改变节点的属性来实现节点的更新。 二、key 使用 id 与 index 的区别不推荐使用index作为key，因为这种做法会导致某些节点被错误地原... 一、key 的作用作为一个DOM节点的标识值，结合Diff算法可实现对节点的复用。(key相同的节点会被复用。)只有当key(或其他导致isSameNode判断为false)发生改变时，才会触发节点的重新渲染。否则Vue将会复用之前的节点，通过改变节点的属性来实现节点的更新。 二、key 使用 id 与 index 的区别不推荐使用index作为key，因为这种做法会导致某些节点被错误地原...
- 一、前言highlight.js 支持几十种编程语言（点击下载），既包括常见的 C、java、javascript、ruby、python、html、css、sql等，还支持 apache、nginx 这些配置文件的语法。除了引入Vue-highlight.js文件外，还需要引入样式文件highlight.js。vue-highlight.js只是实现了代码高亮的功能，安装包里是没有css... 一、前言highlight.js 支持几十种编程语言（点击下载），既包括常见的 C、java、javascript、ruby、python、html、css、sql等，还支持 apache、nginx 这些配置文件的语法。除了引入Vue-highlight.js文件外，还需要引入样式文件highlight.js。vue-highlight.js只是实现了代码高亮的功能，安装包里是没有css...
- 一、前言在Vue项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单注意事项。Form必须要有ref属性；Form必须绑定:model；<Form re... 一、前言在Vue项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单注意事项。Form必须要有ref属性；Form必须绑定:model；<Form re...
- 一、前言在Vue项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单注意事项。Form必须要有ref属性；Form必须绑定:model；<Form re... 一、前言在Vue项目开发过程中，应用this.$refs[name].resetFields();实现表单搜索元素重置时发现失效。经检查发现是form-item绑定的属性prop与包裹元素el-input绑定值不一致造成的。现梳理有关应用this.$refs[name].resetFields();重置表单注意事项。Form必须要有ref属性；Form必须绑定:model；<Form re...
- 最近做了一个Vue开源项目库汇总，里面集合了OpenDigg 上优质的Vue开源项目库，方便Vue开发人员便捷的找到自己需要的项目工具，感兴趣的可以到GitHub上给个star。UI组件element ★9305 - 饿了么出品的Vue2的web UI工具套件Vux ★6802 - 基于Vue和WeUI的组件库mint-ui ★4776 - Vue 2的移动UI元素iview ★4458 -... 最近做了一个Vue开源项目库汇总，里面集合了OpenDigg 上优质的Vue开源项目库，方便Vue开发人员便捷的找到自己需要的项目工具，感兴趣的可以到GitHub上给个star。UI组件element ★9305 - 饿了么出品的Vue2的web UI工具套件Vux ★6802 - 基于Vue和WeUI的组件库mint-ui ★4776 - Vue 2的移动UI元素iview ★4458 -...
- 一、前言在Vue项目开发过程中，当遇到应用逻辑出现错误，但又无法准确定位的时候，知晓Vue项目调试技巧至关重要。同后台项目开发一样，可以在JS实现的应用逻辑中设置断点，并进行单步、进入方法内、跳出方法等调试，从而准确定位问题根源。本文主要讲解针对JetBrains系列WebStorm下Vue项目进行调试的2种方法：debugger和Vue-devtools。 二、debuggerdebug... 一、前言在Vue项目开发过程中，当遇到应用逻辑出现错误，但又无法准确定位的时候，知晓Vue项目调试技巧至关重要。同后台项目开发一样，可以在JS实现的应用逻辑中设置断点，并进行单步、进入方法内、跳出方法等调试，从而准确定位问题根源。本文主要讲解针对JetBrains系列WebStorm下Vue项目进行调试的2种方法：debugger和Vue-devtools。 二、debuggerdebug...
- 一、前言在Vue项目开发过程中，以父子组件的形式进行页面调用，在测试过程中发现IE9下，子组件中定义初始化数据dataA=0，执行异步逻辑A，在异步请求方法前，输出dataA结果为0，请求结束后时，后台返回值将dataA赋值为1，输出dataA结果为1。再次触发子组件同样事件，但后台请求结果不满足赋值条件，对dataA不做赋值操作，发现在异步请求方法前后，输出dataA结果为1！伪码如下：... 一、前言在Vue项目开发过程中，以父子组件的形式进行页面调用，在测试过程中发现IE9下，子组件中定义初始化数据dataA=0，执行异步逻辑A，在异步请求方法前，输出dataA结果为0，请求结束后时，后台返回值将dataA赋值为1，输出dataA结果为1。再次触发子组件同样事件，但后台请求结果不满足赋值条件，对dataA不做赋值操作，发现在异步请求方法前后，输出dataA结果为1！伪码如下：...
- 一、前言利用elementUI实现表单元素校验时，出现下拉框内容选中后校验不消失的异常校验情形。通过去除校验规则中相应元素的trigger:'blur'属性，可解决以上问题。至于表单校验时，校验元素trigger属性值的选择，需要继续深究。若不设置trigger属性，该属性是否有默认值？ 二、表单验证时，trigger:‘blur’ OR trigger:‘change’ OR 不设置？对... 一、前言利用elementUI实现表单元素校验时，出现下拉框内容选中后校验不消失的异常校验情形。通过去除校验规则中相应元素的trigger:'blur'属性，可解决以上问题。至于表单校验时，校验元素trigger属性值的选择，需要继续深究。若不设置trigger属性，该属性是否有默认值？ 二、表单验证时，trigger:‘blur’ OR trigger:‘change’ OR 不设置？对...
- 一、场景描述在Vue项目优化过程中，页面部分通过JS调用promise返回的异步数据，导致页面部分始终无法加载后台返回的数据。通过触发其他DOM操作（例如折叠栏位的操作），后台数据可以正常渲染展示。处理逻辑大致如下：<template> <div v-for="(items, index) in results" :key="items.itemsID"> <span v-for="(i... 一、场景描述在Vue项目优化过程中，页面部分通过JS调用promise返回的异步数据，导致页面部分始终无法加载后台返回的数据。通过触发其他DOM操作（例如折叠栏位的操作），后台数据可以正常渲染展示。处理逻辑大致如下：<template> <div v-for="(items, index) in results" :key="items.itemsID"> <span v-for="(i...
- 一、前言项目开发过程中，组件通过render()函数渲染生成，并在组件内部定义了自定义拖拽指令。自定义拖拽指令实现了用户可以进行元素拖拽、缩放等一系列逻辑处理的动作。另一个逻辑处理页面由Vue实现，该页面可以实时展示元素相关属性信息（包括size、width、height及left、top等属性）。 二、思路监听器方式实现；Vuex state实现; 三、代码实现.js// 鼠标按下事件e... 一、前言项目开发过程中，组件通过render()函数渲染生成，并在组件内部定义了自定义拖拽指令。自定义拖拽指令实现了用户可以进行元素拖拽、缩放等一系列逻辑处理的动作。另一个逻辑处理页面由Vue实现，该页面可以实时展示元素相关属性信息（包括size、width、height及left、top等属性）。 二、思路监听器方式实现；Vuex state实现; 三、代码实现.js// 鼠标按下事件e...
- js获取url参数有两种情况： 一、应用场景一：内部页面之间互相传值假如要从A页面跳转到B页面，this.$router.push({path:"/B",query:{ Id : this.tId , ...}})进入B页面之后，this.Id = this.$route.query.Id;就能将A页面的id传入B页面，进行参数获取。 二、应用场景二：外系统跳转Vue项目时自带参... js获取url参数有两种情况： 一、应用场景一：内部页面之间互相传值假如要从A页面跳转到B页面，this.$router.push({path:"/B",query:{ Id : this.tId , ...}})进入B页面之后，this.Id = this.$route.query.Id;就能将A页面的id传入B页面，进行参数获取。 二、应用场景二：外系统跳转Vue项目时自带参...
- 一、前言Vue项目编译过程中，出现如下错误信息：ERROR in static/js/vendor.f1c68aa2d5e85847d30e.js from UglifyJsUnexpected token name «i», expected punc «;» [./node_modules/element-ui/src/utils/merge.js:2,0][static/js/ven... 一、前言Vue项目编译过程中，出现如下错误信息：ERROR in static/js/vendor.f1c68aa2d5e85847d30e.js from UglifyJsUnexpected token name «i», expected punc «;» [./node_modules/element-ui/src/utils/merge.js:2,0][static/js/ven...
- 一、前言vant中的van-image组件的src参数默认为图片的网络链接：<van-image width="100" height="100" src="https://img.yzcdn.cn/vant/cat.jpeg"/>当要引用本地的图片时，直接写图片的路径在vue项目中会刷不出图片（但用 <img> 标签可以显示 ）。 二、解决方式一<van-swipe :autopl... 一、前言vant中的van-image组件的src参数默认为图片的网络链接：<van-image width="100" height="100" src="https://img.yzcdn.cn/vant/cat.jpeg"/>当要引用本地的图片时，直接写图片的路径在vue项目中会刷不出图片（但用 <img> 标签可以显示 ）。 二、解决方式一<van-swipe :autopl...
- 源代码如下：import { createApp } from 'vue'import App from './App.vue'createApp(App).mount('#app')import 关键词用于在 JavaScript 文件中引入模块。{ createApp } 从 ‘vue’ 模块中导入 createApp 方法。createApp 是 Vue 3.x 中用于创建应用程序实例... 源代码如下：import { createApp } from 'vue'import App from './App.vue'createApp(App).mount('#app')import 关键词用于在 JavaScript 文件中引入模块。{ createApp } 从 ‘vue’ 模块中导入 createApp 方法。createApp 是 Vue 3.x 中用于创建应用程序实例...
上滑加载中
推荐直播
-
HDC深度解读系列 - Serverless与MCP融合创新，构建AI应用全新智能中枢2025/08/20 周三 16:30-18:00
张昆鹏 HCDG北京核心组代表
HDC2025期间，华为云展示了Serverless与MCP融合创新的解决方案，本期访谈直播，由华为云开发者专家(HCDE)兼华为云开发者社区组织HCDG北京核心组代表张鹏先生主持，华为云PaaS服务产品部 Serverless总监Ewen为大家深度解读华为云Serverless与MCP如何融合构建AI应用全新智能中枢
回顾中 -
关于RISC-V生态发展的思考2025/09/02 周二 17:00-18:00
中国科学院计算技术研究所副所长包云岗教授
中科院包云岗老师将在本次直播中，探讨处理器生态的关键要素及其联系，分享过去几年推动RISC-V生态建设实践过程中的经验与教训。
回顾中 -
一键搞定华为云万级资源，3步轻松管理企业成本2025/09/09 周二 15:00-16:00
阿言 华为云交易产品经理
本直播重点介绍如何一键续费万级资源，3步轻松管理成本，帮助提升日常管理效率！
回顾中
热门标签