- 本文是作者开发一个业务需求时，将返回数据列表的其中一个数据长度很长的字段处理成数组，并将其作为子表显示的过程，具体样式如下（数据做了马赛克处理）返回的过长字段数据处理（用分号分隔的一个长字段）：this.list = this.currentRow.failMessage.split(';')法一：利用插槽获取值法二：利用js数组map方法 “自己封装prop”// 数据处理this.lis... 本文是作者开发一个业务需求时，将返回数据列表的其中一个数据长度很长的字段处理成数组，并将其作为子表显示的过程，具体样式如下（数据做了马赛克处理）返回的过长字段数据处理（用分号分隔的一个长字段）：this.list = this.currentRow.failMessage.split(';')法一：利用插槽获取值法二：利用js数组map方法 “自己封装prop”// 数据处理this.lis...
- 问题原因：多个tabs共用一个实体，动态显示隐藏列 出现了固定在右侧的列(fixed=“right”)错位【解决方案】表格的重新布局，只要table数据发生变化的时候就重新渲染表格this.$nextTick(() => { this.$refs.formname.doLayout()})参考element官方文档 以上就是element-UI el-table动态显示隐藏列造成... 问题原因：多个tabs共用一个实体，动态显示隐藏列 出现了固定在右侧的列(fixed=“right”)错位【解决方案】表格的重新布局，只要table数据发生变化的时候就重新渲染表格this.$nextTick(() => { this.$refs.formname.doLayout()})参考element官方文档 以上就是element-UI el-table动态显示隐藏列造成...
- 添加和修改公用一个弹窗，点击添加弹窗后，如果没移除表单校验的话，再点击修改弹窗时校验就会被记住，所以需要移除校验，但在清空表单校验时会报如下错误：那么，你只需要加上这段话即可this.$nextTick(()=>{ this.$refs.addArray.resetFields(); })再此,我顺便说一下resetFields和clearValidate的区别：this.$ref... 添加和修改公用一个弹窗，点击添加弹窗后，如果没移除表单校验的话，再点击修改弹窗时校验就会被记住，所以需要移除校验，但在清空表单校验时会报如下错误：那么，你只需要加上这段话即可this.$nextTick(()=>{ this.$refs.addArray.resetFields(); })再此,我顺便说一下resetFields和clearValidate的区别：this.$ref...
- 一、前言在应用uni-app跨平台技术栈进行app开发过程中，uni-app官网支持两种页面设计方案：vue与nvue，不少同学在应用过程中，会搞不清楚两者的区别，而不知如何选择，甚至可能产生错误的应用方式。 二、选择方案uni-app App 端内置了一个基于 weex 改进的原生渲染引擎，提供了原生渲染能力。在 App 端，如果使用 vue 页面，则使用 webview 渲染；如果使用... 一、前言在应用uni-app跨平台技术栈进行app开发过程中，uni-app官网支持两种页面设计方案：vue与nvue，不少同学在应用过程中，会搞不清楚两者的区别，而不知如何选择，甚至可能产生错误的应用方式。 二、选择方案uni-app App 端内置了一个基于 weex 改进的原生渲染引擎，提供了原生渲染能力。在 App 端，如果使用 vue 页面，则使用 webview 渲染；如果使用...
- 背景当我们新建vue3项目，package.json文件会自动给我添加一些配置选项，这写选项基本没有问题，但是在实际操作过程中，当项目越来越复杂就会出现问题。本文列举一个目前我遇到的一个问题：打包后报了一堆TS类型错误，怎么消除这些错误？项目环境：Vue3 + Vite + TS 问题描述当项目进行打包时候，突然发现终端有几十项报错npm run build详细报错信息如下：src/vie... 背景当我们新建vue3项目，package.json文件会自动给我添加一些配置选项，这写选项基本没有问题，但是在实际操作过程中，当项目越来越复杂就会出现问题。本文列举一个目前我遇到的一个问题：打包后报了一堆TS类型错误，怎么消除这些错误？项目环境：Vue3 + Vite + TS 问题描述当项目进行打包时候，突然发现终端有几十项报错npm run build详细报错信息如下：src/vie...
- 一、认识ProxyProxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。new Proxy(target,handler)表示生成一个Proxy实例... 一、认识ProxyProxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。new Proxy(target,handler)表示生成一个Proxy实例...
- 一、前言在前期博文《Vue进阶（六十四）：iframe更改src后页面未刷新问题解决》中讲解了iframe更改src后页面未刷新问题的解决方法，此篇博文主要讲解采用iframe方式嵌套页面IE下页面未展示问题的解决方法。 二、问题分析项目的嵌套逻辑如下：通过 A项目系统a1页面点击菜单进入自己的发起页面，点击发起页面发起按钮，调用后台请求返回B项目系统待跳转b1页面URL，A项目系统通过i... 一、前言在前期博文《Vue进阶（六十四）：iframe更改src后页面未刷新问题解决》中讲解了iframe更改src后页面未刷新问题的解决方法，此篇博文主要讲解采用iframe方式嵌套页面IE下页面未展示问题的解决方法。 二、问题分析项目的嵌套逻辑如下：通过 A项目系统a1页面点击菜单进入自己的发起页面，点击发起页面发起按钮，调用后台请求返回B项目系统待跳转b1页面URL，A项目系统通过i...
- 一、前言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...
- 一、前言Vue项目开发过程中，会经常需要使用console.log、console.info、alert等测试语句来输出内容，而在生产环境之中，我们不希望控制台同样输出以上信息，特别是用户信息相关。组包前，逐一去删除、注释显然费时费力，好在Vue提供了通过配置文件修改配置变量，实现在开发环境打印，而生产环境不打印控制台信息的方法。 二、配置文件修改修改build/webpack.prod.... 一、前言Vue项目开发过程中，会经常需要使用console.log、console.info、alert等测试语句来输出内容，而在生产环境之中，我们不希望控制台同样输出以上信息，特别是用户信息相关。组包前，逐一去删除、注释显然费时费力，好在Vue提供了通过配置文件修改配置变量，实现在开发环境打印，而生产环境不打印控制台信息的方法。 二、配置文件修改修改build/webpack.prod....
- 一、引入场景有时候我们不希望组件被重复渲染影响用户使用体验；或出于性能考虑，避免多次重复渲染降低性能。而是希望组件信息可以缓存下来,维持当前的状态。这时候就可以应用keep-alive组件。官网解释：<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素... 一、引入场景有时候我们不希望组件被重复渲染影响用户使用体验；或出于性能考虑，避免多次重复渲染降低性能。而是希望组件信息可以缓存下来,维持当前的状态。这时候就可以应用keep-alive组件。官网解释：<keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素...
- 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项目时自带参...
- 一、前言利用elementUI实现表单元素校验时，出现下拉框内容选中后校验不消失的异常校验情形。通过去除校验规则中相应元素的trigger:'blur'属性，可解决以上问题。至于表单校验时，校验元素trigger属性值的选择，需要继续深究。若不设置trigger属性，该属性是否有默认值？ 二、表单验证时，trigger:‘blur’ OR trigger:‘change’ OR 不设置？对... 一、前言利用elementUI实现表单元素校验时，出现下拉框内容选中后校验不消失的异常校验情形。通过去除校验规则中相应元素的trigger:'blur'属性，可解决以上问题。至于表单校验时，校验元素trigger属性值的选择，需要继续深究。若不设置trigger属性，该属性是否有默认值？ 二、表单验证时，trigger:‘blur’ OR trigger:‘change’ OR 不设置？对...
- 一、前言在vue项目开发过程中，使用axios请求后台时，后台无法获取前端传参数据。qs 是一个增加了一些安全性查询字符串解析和序列化字符串的库。 二、安装npm install qs 三、在组件中应用import qs from 'qs'或定义为全局组件：//在main.js引入qs import qs from 'qs' //配全局属性配置，在任意组件内可以使用this.$qs获... 一、前言在vue项目开发过程中，使用axios请求后台时，后台无法获取前端传参数据。qs 是一个增加了一些安全性查询字符串解析和序列化字符串的库。 二、安装npm install qs 三、在组件中应用import qs from 'qs'或定义为全局组件：//在main.js引入qs import qs from 'qs' //配全局属性配置，在任意组件内可以使用this.$qs获...
- 一、场景描述在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...
上滑加载中
推荐直播
-
华为云码道Skill实战与极速交付，智能开发全链路实战2026/07/22 周三 19:00-21:00
王一男-华为云码道产品规划专家；李炎-华为云码道产品专家；姜浩-华为云HCDG核心组成员
直播深度解读华为云码道6月产品新特性，从Skill市场安装专家技能，带你零距离体验从需求，开发，审查，重构全链路闭环的开发过程。从零构建并交付一个完整项目，让您体验从代码提交到服务上线的“极速”之旅。
回顾中 -
聚开发者之力，创具身新未来2026/07/23 周四 15:00-17:00
张豪杰/程文/王军/刘新春/黄钦开 /张晓天
本次华为云具身智能开发平台CloudRobo培训面向具身智能开发者，带您全流程体验机器人本体R2C小时级接入、环境重建与轨迹生成仿真数据生产、PB级数据管理、数据评测、模型训推、强化学习和Benchmark一键评测等功能，并体验业界主流具身模型应用。
回顾中 -
用码道，让你的AI作品三步上朋友圈2026/08/04 周二 19:00-20:00
林华鼎-华为云AI开发者运营负责人
从入门 · 到做AI应用 · 到企业级开发。不教编程，只教用AI · 零代码、有产出、能带走、可炫耀 · 每课人人动手实操
回顾中
热门标签