Vue
文章平均质量分 53
Vue 框架学习记录
沐 修
唯自由与理想不可辜负
展开
-
Windows『技巧』在不同前端项目中各种启动不同的Node环境、nodemon代替node自动重启项目 -Linux 在不同前端项目中各种启动不同的Node环境(.nvmrc Windows 无效)
总之,有多少项目,就需要切换指定的Node 环境,然后在使用 npm 命令启动,还有最好是使用热启动方法,如果更改了代码,完全不用考虑需要按之前切换 Node 环境后,再重启某个项目,这样子太麻烦了,热启动会自动调用之前指定了的 Node 环境,进行重启项目,这一笔者实验过,在开发上很方便快捷。当然也许不用安装,最近的一些 Vue 框架项目,好像在代码更改后,会自动重启——热启动。当然这得由个人判断是否安装热启动依赖。使用 npm 命令,启动 Vue 项目,这里是 1 号项目。原创 2023-10-12 11:48:23 · 298 阅读 · 0 评论 -
当element ui el-dialog弹窗有缓存,每次打开弹窗的时候会出问题的解决方法
解决方法:如下是解决方案。用el-dialog 里面有一个(关闭时销毁 Dialog 中的元素)这个完全没用。其实很简单。只需要在 el-dialog 外层加一层div 然后在 div 上写上 v-if="dialogVisible"就行了。原创 2023-09-15 10:48:09 · 1497 阅读 · 0 评论 -
JavaScript 判断字符串或数字数组内是否存在某个字符串或者是某个数字
【代码】JavaScript 判断字符串或数字数组内是否存在某个字符串或者是某个数字。原创 2023-09-14 09:42:21 · 323 阅读 · 0 评论 -
在配置了 el-table 组件的合计行后,由于elementUI 表格el-table设置高度之后,合计行功能不会显示
在配置了 el-table 组件的合计行后,由于elementUI 表格el-table设置高度之后,合计行功能不会显示。原创 2023-09-14 09:34:37 · 1145 阅读 · 0 评论 -
Vue el-table 重置按钮设计模板
重点就是这句:(意思是将初始状态的data复制到当前状态的data,实现重置效果)还有这一句:清除 el-table 复选框的选择显示, 指的是 组件的 属性值最后点击重置按钮后的效果类似如下所示:1. vue 重置按钮功能实现2. vue之ele中的table组件(复选框的回显和重置)3. 4-2-vue框架-第三方ui组件elementui-vue- element-ui table复选框翻页记忆与清除原创 2023-09-09 16:37:58 · 763 阅读 · 0 评论 -
若依框架 - 角色按钮权限控制 v-hasPermi=“[‘system:role:add‘]“ | v-if=“checkPermi([‘system:role:add‘])“ 特别用法
若依框架的权限标识,需要手动在控制台添加菜单,首先在父菜单下点击新增菜单,然后再选择按钮,然后再输入按钮的菜单名称和排序顺序,以及最重要的权限标识。上面的菜单顺序,是由于用户权限分配角色的操作所决定的,会有点古怪,但真实操作给用户进行角色分配时,是非常有用灵活的。原创 2023-09-08 14:37:38 · 7112 阅读 · 0 评论 -
关于实现 Vue 动态数据显示,比如数字 0 或 1 怎么显示为 男 或 女等等的动态显示实现方法
test.vue以上关于数据test.data是数字格式的动态数据显示,有两种实现方法可以实现,方法二的灵活性比较好(比较推荐)原创 2023-09-07 11:28:11 · 1221 阅读 · 0 评论 -
后端数据配置相对路径,前端添加网站根 URL (根路径)- js获取网站项目根路径- 获取根路径后的第一个斜杠前 / 的项目- - 判断url包含某字符串
js获取项目根路径,如下:原。原创 2023-08-31 10:39:30 · 1742 阅读 · 0 评论 -
Vue 最简单最好用的组件通信方法 - $ref父组件对子组件发起通信 - $emit子组件对父组件发起通信 - Vue 路由通信 由props 参数发起通信
通过实行了Vue 组件的其他的通信方法,发现最简单最好用的是使用 $ref 方法让父组件对子组件发起通信,Vue 路由则是由 props 参数来获取组件的通信数据。本文只介绍 $ref父组件对子组件发起通信 - $emit子组件对父组件发起通信。" -------------------------- 父组件接收到子组件的消息:已收到子组件的消息!'父组件消息:Father Data!'子组件消息:Child Data!// 给父组件发送消息。原创 2023-08-30 17:52:21 · 149 阅读 · 0 评论 -
前端 CSS - 如何隐藏右侧的滚动条 -关于出现过多的滚动条导致界面不美观
CSS 配置:下面两个一起写进进去,适配 IE、火狐、谷歌浏览器。原创 2023-08-30 14:43:20 · 1223 阅读 · 0 评论 -
Java Vue (el-date-picker组件) 前后端 关于时间格式数据的处理方法
其中组件需要格式化时间,增加属性。原创 2023-08-17 18:27:23 · 1219 阅读 · 0 评论 -
前端数据格式为 [1,2,3.xxx] 字符串列表类型,对应后端JAVA String[] 类型 - 关于前后端(JavaScript、Vue&Java)列表与数组的理解 -时间范围数据格式问题
列表指的是标量到有序集合,而数组则是存储列表到变量。列表指的是数据,而数组指的是变量。原创 2023-08-17 18:22:14 · 80 阅读 · 0 评论 -
Vue 前端问题 - 学习记录
有时候,我们是使用单文件模式来开发 Vue 项目,那么如果此时的项目的 头部导航组件和主要内容组件是分开的,那么父组件又该如何获取 子组件的 ref 属性,这里的关键在于 父组件必须配置一个 ref ,而且必须是要包括了 子组件的标签内,否则无法获取子组件的 ref 属性,也就无法获取子组件的 dom 元素,当然如果是在父组件使用子组件时,配置 ref 属性,那就最好了。下面需要对 Vue 有一个大致的使用经验:(比如在父组件内怎么引用子组件的方法,和在父组件的。一个元素会有一个在它内容前面的元素(原创 2023-07-15 15:43:59 · 157 阅读 · 0 评论 -
3. Windows 10 - Nvm - Node - 创建 Vue项目 Vue-cli 脚手架 3.x
文件夹进行一个权限配置,其配置将会直接作用于其子文件夹,如果为了一劳永逸的,直接将。安装目录整个配置一个权限,后面就不会老是出现这个问题了。(笔者这里是权限问题,所以如果是。隔离的配置,那么直接将。原创 2023-07-15 15:36:15 · 268 阅读 · 0 评论 -
el-input type=‘textarea’后高度 height 设置 - 当 :row 属性无效时
el-input type=‘textarea’后高度设置原创 2023-07-11 11:02:24 · 1927 阅读 · 0 评论 -
el-pagination 组件数据持久化,缓存当前页面数据
一般在,即事件中缓存当前的页面页码数据提示: 如果你只想将数据保存在当前会话中,可以使用 sessionStorage 属性, 该数据对象临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据。所以笔者个人推荐使用来缓存页码数据然后怎么获取缓存的数据,然后在赋予缓存的页码数据的方法:(需要提醒的是缓存的数据是字符串,所以要转换为数字类型的数据,否则 el-pagination 组件会报错的)如下举例:数据转换为数字类型的。原创 2023-07-08 18:04:57 · 998 阅读 · 0 评论 -
el-date-picker 的初始化数据格式理解、报错 “TypeError: date.getFullYear is not a function“
如果后端传给前端的时间数据是字符串类型的,那么当触发 el-date-picker 组件时,就会报出很多错误,例如这是由于初始化赋值格式的问题,需要对初始化值,进行一个。原创 2023-07-07 17:19:49 · 1562 阅读 · 0 评论 -
Vue 过滤器 - 时间数据格式化过滤器模板 - 配合 el-date-picker 组件的使用、构造自定义时间数据格式标准化方法
在 vue 项目的main.js${${${原创 2023-07-07 11:13:08 · 486 阅读 · 0 评论 -
关于 若依框架(前后端隔离版本) 图片映射问题的解决方法 (解决跨域问题,配置代理路由)
开发代理:在 vue 项目内的配置文件内配置devserver配置,在 proxy 参数内配置两个代理路径,如生产代理:在nginx配置文件nginx.conf内配置 图片代理路由,类似/proc-api/一样的路由。原创 2023-07-07 09:38:56 · 1743 阅读 · 0 评论 -
Java、 Vue 前后端数据封装传递具体实现方法,如何将JavaScript对象转换为具体的实体类对象 - 若依框架模板、字符串数组[1,2,... ] 的后端转化 String[]
就笔者目前来看,前端无论是使用怎么的方法封装数据的,最好是使用 formData 类型的对象存储数据,而且内部所有的key 键对应的值,最好是字符串类型的,将 JavaScript 对象的数据转变为字符串格式,即 Json 字符串格式,前端方法有, JavaScript 对象一般为花括号。VueTest.js文件(api 接口文件)(组件)原创 2023-07-01 16:12:46 · 687 阅读 · 0 评论 -
Vue - 关于el-dialog 会让body 标签内的滚动条隐藏,导致窗口抖动的问题 和双滚动条问题
关于el-dialog 会让body 标签内的滚动条隐藏,导致窗口抖动的问题。原创 2023-06-15 14:06:32 · 3315 阅读 · 0 评论 -
2. Windows 10 - Nvm - node版本管理工具的安装、配置/全局配置(自动切换)、卸载方法 - 安装cnpm报错与解决方法 - 已安装 Node不卸载的方法
做个总结,笔者这里主要讲解的是,使用 nvm (Node版本管理工具)切换到某个版本的 Node 环境时,要使用当前 Node 内置的 npm 来切换全局配置和缓存目录配置,将路径切换为当前 Node 目录下的node_cache和,以此保证在开发项目时的版本一致性,隔离其他的环境影响。其他的都是次要内容,都是可以在网上找到的资料。下面的 四、报错文件集锦 都是这次测试附带的。原创 2023-06-07 10:34:13 · 11162 阅读 · 2 评论 -
Vue - Vue 路由 - 组件通信 —> 父组件 —>子组件的参数传值 、父组件触发子组件的函数
笔者遇到了一个比较特殊的设计要求,从 Vue 路由传递某个参数给某个组件,然后在使用这个父组件将这个参数传递给子组件,看似挺复杂的,其实实现后,还是挺简单的。可以说下方的参考链接好坏掺杂,本文是笔者提取了参考链接内的精华部分所写。原创 2023-06-01 18:16:24 · 802 阅读 · 0 评论 -
前端 - 如何实现让滚动条丝滑的滚动
1. vue控制滚动条滑到某个位置原创 2023-05-31 17:19:07 · 516 阅读 · 0 评论 -
前端 - 关于下拉功能的实现,<detail> <summary> 特殊标签 - 进度条功能实现
如果是为了快速开发下拉菜单,样式什么的,都太大要求的,其实直接用 detail 标签就行,在summary 标签内,可以塞入各种你想到的想不到的东西,反正鼠标点击 summary 标签元素的范围,就属于触发了显示弹出的功能,还有笔者还没详细用过这个标签,不太好判断是否会影响样式的修改,比如是为了炫酷好看的样式,detail 标签无法实现之类的,就比如部分标签对样式修改不友好。原创 2023-05-31 14:50:29 · 203 阅读 · 0 评论 -
Vue 回退上一页,缓存保留上一页数据的实现方法
1. 路由跳转,返回旧页面保留操作数据。2. vue返回上一页go()和back()3. vue中记录滚动条位置4. vue跳转页面后返回不刷新且记录历史滚动条停留位置 (实现了根据不同页面来设置是否刷新记录的功能)5. 获取滚动条位置原创 2023-05-29 18:10:23 · 1336 阅读 · 0 评论 -
Vue 原始(传统)或特别的视频组件具体实现方法
简单点的理解,就是没有点击就会暂停播放视频,还有忽略了音频,鼠标点击视频也不会停止,完全自循环播放,后面就是对这个视频进行灵活的前端排版了。原创 2023-05-29 18:09:59 · 1308 阅读 · 0 评论 -
Vue 脚手架(打包工具)的理解 - 配置文件理解
Vue脚手架是Vue作为一个前端开发项目的最核心点,将JavaScriptCSSHTML这几种前端自动整合,极大的简化了前端开发工作。没有 Vue 脚手架,就没有 Vue ,这是一定的,Java 语言和C语言都需要编译,那么你可以将 Vue 脚手架看作是伪编译器吧,或者是伪解释器,当然伪解释器比较准确点。原创 2023-05-29 18:05:34 · 1161 阅读 · 0 评论 -
Vue - 控制台报错 Duplicate keys detected: ‘0‘. 或者是 Duplicate keys detected: ‘1‘.
Vue 的:key是一种唯一的标识,那么我们应该弄一个比较符合该循环的唯一标识,笔者是这样认为的,例如其中index是一个字符串的格式,不然无法和我们自定义的'test'字符串拼接。原创 2023-05-25 16:37:09 · 327 阅读 · 0 评论 -
Vue - el-button 学习记录
禁用状态:正常状态:使用 v-bind 动态更改 button 的 disabled 属性,默认值是 false单选修改按钮,多选时修改按钮是禁用状态多选删除按钮。原创 2023-05-16 15:08:53 · 214 阅读 · 0 评论 -
Vue - el-form的学习记录 - 记录问题解决方法
必须为每一个配置一个指定的prop参数,它会跟进初始值,还原原来的值。根据文档显示,resetFields是对整个表单进行重置,将所有字段值重置为空并移除校验结果。但是实际上resetFields是清空validateMessage,然后把值重置成了上一次初始化的值。form的每个item加prop属性,需要和绑定数据的最后名称一致。原创 2023-05-16 15:07:25 · 528 阅读 · 0 评论 -
使用 Vue 路由 GET 和 POST 的参数注意要点
必须区分 和 参数,请勿弄混了 和 的参数( —> )( —> )前端vue api接口 get方法模板演示:POST 方法参数:前端vue api接口 post方法模板演示:原创 2023-05-16 15:03:52 · 243 阅读 · 0 评论 -
Semantic UI 的学习记录 - 一步一坑 (此前端框架极度缺少资料)
笔者认为这个框架的 api 实在是很不好用,如果是使用下拉菜单模块,api 非常不友好,笔者用的最顺手的是使用 ajax 初始化下拉菜单的数据。用于配置全局的 url 给 action 传递 url 变量。原创 2023-04-21 09:39:59 · 135 阅读 · 0 评论 -
同步后端数据库时间存储格式 - Vue 前端时间组件 el-date-picker 配置 - 适用于 MongoDB、MySQL...
1. vue时间组件精确到时分秒—datetime原创 2023-04-19 14:37:03 · 154 阅读 · 0 评论 -
Vue 无阻碍刷新页面 - 无空白间隙刷新 - 执行增删改操作后刷新页面
1. vue——执行增删改操作后刷新页面原创 2023-04-12 16:54:25 · 160 阅读 · 0 评论 -
若依框架 - 前端后端分离 vue element 组件模板 el-table 表格点击式可编辑表格 - 分页跳转回显(保存上一次的选择)- 按钮式可编辑表格- 弹窗表格 el-table 滚动条设置
xxx.vue。原创 2023-04-11 11:20:20 · 2452 阅读 · 0 评论 -
elementui中组件el-dialog宽度调整方法
参考链接:https://www.bilibili.com/read/cv21017844原创 2023-04-10 20:46:31 · 2286 阅读 · 0 评论 -
1. Windows 10 - Node与Vue - 安装 Vue 2.x 及 3.x 框架 - 项目创建要点
目录一、vue 简介:二、设置node的全局和缓存路径手动创建node.js的全局和缓存路径目录Windows命令行配置node.js的全局和缓存路径三、安装 Vue 框架提升安装 Vue 框架速度的方法1、设置淘宝镜像手动配置系统环境变量正式安装 Vue 框架1、安装Vue-cli脚手架2、创建 Vue 项目3、访问已测试是否创建运行成功Vue 框架脚手架版本的替换方法1、3.0以下切换至3.0以上2、 3.0以上切换回3.0以下一、vue 简介:vue的运行是要依赖于node的npm的管理工具来实现原创 2022-05-13 18:12:41 · 6453 阅读 · 0 评论