vue2专题
vue2实践：el-table实现由用户自己控制行数的动态表格
需求 项目中需要提供一个动态表单，如图： 当我点击添加时，便添加一行；点击右边的删除时，便删除这一行。 至少要有一行数据，但是没有上限。 思路 这种每一行的数据固定，但是不定行数的，很容易想到使用el-table来实现，它可以循环读取:data所绑定的数组，来生成行数据，不同的是： 1、table里面的每一个cell，需要放置一个input来支持用户编辑。 2、最后一列放置两个b
vue2实践：第一个非正规的自定义组件-动态表单对话框
前言 vue一个很重要的概念就是组件，作为一个没有经历过前几代前端开发的我来说，不太能理解它所带来的“进步”，但是，将它与后端c++、java类比，我感觉，组件就像是这些语言中的类和对象的概念，通过封装好的组件（类），可以通过挂载的方式，非常方便的调用其提供的功能，而不必重新写一遍实现逻辑。 我们常用的element UI就是由饿了么所提供的组件库，但是在项目开发中，我们可能还需要额外地定义一
Vue2电商项目(二) Home模块的开发；（还需要补充js节流和防抖的回顾链接）
文章目录 一、Home模块拆分1. 三级联动组件TypeNav2. 其余组件 二、发送请求的准备工作1. axios的二次封装2. 统一管理接口API----跨域3. nprogress进度条 三、 vuex模块开发四、TypeNav三级联动组件开发1. 动态展示三级联动数据2. 三级联动 动态背景(1)、方式一：CSS样式(2)、方式二：JS 3. 控制二三级数据隐藏与显示--绑定styl
vue3和vue2的双向绑定原理
Vue 的双向绑定是其核心特性之一，允许数据和视图之间保持同步。在 Vue 2 和 Vue 3 中，双向绑定的实现原理有所不同。以下是两者的原理对比： Vue 2 的双向绑定原理 在 Vue 2 中，双向绑定是通过以下机制实现的： 响应式系统: Vue 2 使用 Object.defineProperty 来实现响应式数据。通过在对象的每个属性上定义 getter 和 setter，Vue
vue2+ueditor集成秀米编辑器
一、百度富文本编辑器 1.首先下载 百度富文本编辑器 下载地址：GitHub - fex-team/ueditor: rich text 富文本编辑器 2.把下载好的文件整理好 放在图片目录下 3. 安装插件vue-ueditor-wrap npm install vue-ueditor-wrap 4.在你所需要展示的页面 引入vue-ueditor-wrap 此时
Vue2 与 Vue3 的区别有哪些
Vue 2 和 Vue 3 在许多方面都有显著的区别，包括性能、API 设计、功能特性等。以下是它们主要的区别： 1. 响应式系统 Vue 2: 基于 Object.defineProperty: Vue 2 使用 Object.defineProperty 来实现响应式数据。这种方法在处理对象属性时有一定的局限性，比如不能检测到对象属性的添加或删除，以及数组的变更（如长度变化）。Vue 3:
vue2，vue3基于elementUI的el-table实现复制粘贴功能
vue2，vue3基于elementUI的el-table实现复制粘贴功能 vue2vue3 1、先声明一下，为啥又有vue2和vue3呢，因为老项目要改造成vite+ts+vue3,时间紧，来不及全部转换，所以就有了componentApi和optionsApi共存的情况 2、单页面使用，全局未实现 vue2 既然是基于el-table呢就有现成的methods可以使用 @
Vue2升级Vue3 --- 第三方库变化（基于gogocode）
本次升级基于gogocode快捷转换gogocode升级体验，汇总的部分问题可能与gogocode有关，但仍可作为vue2升级vue3过程中报错问题的解决参考 第三方库变化 1.vue-contextmenujs(右键菜单) // 原第三方库不支持vue3，更换为支持vue3的库"@imengyu/vue3-context-menu": "^1.0.8"// 更换库后组件样式与以前不
在 vue2 中实现 echarts 立体方形柱状图及立体圆柱
1、在做大屏项目时，为了页面不显得单调，有时设计会设计些立体的柱状图，前几天做大屏刚好遇到，记录一下。echarts本身没有配置直接配置立体图，立体图实质是三个图形合并堆积形成的视觉效果，分别是上面的盖，中间主体和下面的底，再配合中间主体的渐变颜色而实现。本文默认都是使用过echarts的，常规项不赘述，只看option的配置项，先上效果。 2、立体方块图 pdChartOptio
vue2-elementUI-初始化启动项目-git
前置基础 资料下载-阿里云盘 vueaxioselement-uinpmvscode 初始化项目 1.创建vue2工程 1.1 vue create projectName 1.2 选择 1.3 初始化 vue-cli 的核心步骤： Manually select features + (*) Babel + ( ) TypeScript + ( ) Progressive
Vue2项目搭建：Vue2.7+Vite4+Pinia+TailwindCSS+Prettier+ESLint
目前 create-vue 和 Vite 都不提供 Vue2 项目的搭建，不想用 Vue CLI 和 webpack，于是就打算从 0 搭建一个工程化项目，支持组合式 API (Composition API) 写法，没有使用 TypeScript，有朋友需要的话我可以再完善一下。 Node.js 16.xpnpm 8.x 初始化 mkdir vue2-vitecd vue2-vit
vue2打包部署到nginx，解决路由history模式下页面空白问题
项目使用的是vue2，脚手架vue-cli 4。 需求：之前项目路由使用的是hash，现在要求调整为history模式，但是整个过程非常坎坷，遇到了页面空白问题。现在就具体讲一下这个问题。 首先，直接讲路由模式由hash改为了history。 在vue.config.js中的配置 然后直接进行打包。 nginx的配置： 此时，启动nginx，访问项目http://local
vue2中用到了 vuex 实现一个 留言板效果
一.效果图展示： 二.静态网页（html）代码 <template><div><h1>班级留言板</h1><ol><li v-for="(msg, index) in classmsgs" :key="index">{{ msg }} <a href="#" @click.prevent="delmsg(index)">删除</a></li></ol><textarea name=""
vue3有了解过吗？和vue2的区别
vue3介绍 🍕🍕🍕关于vue3的重构背景，作者是这样说的： 「Vue 新版本的理念成型于 2018 年末，当时 Vue 2 的代码库已经有两岁半了。比起通用软件的生命周期来这好像也没那么久，但在这段时期，前端世界已经今昔非比了。在我们更新（和重写）Vue 的主要版本时，主要考虑两点因素：首先是新的 JavaScript 语言特性在主流浏览器中的受支持水平(利用新的语言特性[es6])；
前端宝典二十五：vue2高阶用法mixin、transition、slot
本文主要探讨vue2中几个高阶的用法：mixin、transition、slot 一、mixin 在 Vue 中，mixin（混入）是一种用于在多个组件之间共享代码的机制。它允许你定义可重用的选项对象，并将其混入到不同的组件中。 1、使用方法 创建一个混入对象： const myMixin = {data() {return {sharedData: '这是混入中的共享数据',};},m
vue-element-admin(vue2) 二次开发需注意事项
目录 ElementUI1. 添加Iconfont的svg图形2. 三级/四级路由嵌套3. `el-divider` 组件无法使用4. 多个上传组件`el-upload`无法确定操作的是哪一个5. elementUI table组件表头未对齐6. Tree 水平和垂直滚动条及样式7. el-dialog组建中使用el-tree组件，显示影藏el-dialog组件的时候，tree中节点的che
Vue2转Vue3学习历程
选项式API=>组合式API vue3和vue2的差别就是选项式api改为组件式api，就是以前vue2要定义data、method、mounted，在vue3就变为了更模块化的，并且我感觉vue3设计思路更多是以调用方法的方式实现，比如我实现一个方法，并且通过setup语法糖省略data、method <script setup>import {ref, reactive, onMount
Vue2与Vue3区别以及兼容那些浏览器酌情使用
一、vue2与vue3区别 vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架，具有简洁的语法和丰富的组件库，可以用于开发单页面应用程序和多页面应用程序。 项目地址：https://gitcode.com/gh_mirrors/vu/vue 免费下载资源 1.根节点不同 vue2中必须要有根标签vue3中可以没有根标签，会默认将多个根标签包裹在一个fragemen
vue2表格显隐列的封装【升级缓存版】
背景 我们知道，若依后台有列表页、表格字段有显隐列的功能，但是，页面一旦刷新，就又回到初始状态了，但是有时候我们想要刷新后也保留我们设置的显隐列，就需要自己封装了 若依显隐列示例图如下： 源码 效果展示 效果图如下，点击设置显隐列图标，弹框设置界面，点击修改后会保存设置，刷新后按照我们的设置来显示，即缓存版 使用方法 在合适的位置（一般在表格上方）放置显隐列组件，该组件默认只展示
Vue面试常见知识总结2——spa、vue按需加载、mvc与mvvm、vue的生命周期、Vue2与Vue3区别
SPA SPA（Single Page Application，单页面应用）是一种Web应用程序架构，其核心特点是在用户与应用程序交互时，不重新加载整个页面，而是通过异步加载页面的局部内容或使用JavaScript动态更新页面。以下是对SPA的详细解析，包括其优点和缺点： SPA的优点 更好的用户体验： SPA无需重新加载整个页面，使用户在应用程序中浏览时感觉更为流畅，提高了用户体验。页
新的打包工具 Rsbuild 尝鲜：Vue2-cli 项目迁移 Rsbuild
当前时间 2024-08-31 看到一个新的打包工具，于是想试一试，这里是官网 测试 用过 vue-cli 的同志们应该有所感受，启动项目挺慢的，我这个项目不太大，第一次启动是最慢的，之后启动快了一些些，而且也是编译了三四次，也花费了六七秒的时间（第一次的时间大概有10多秒，我没录下来） 再试试 rsbuild，用了不到 4s，不过对比第一次冷启动还是快了不少的
腾讯云TRTC无UI集成——分享屏幕主流、辅流（Vue2+JS+TRTC无UI集成）
先阐述一下问题，在项目中用到腾讯云的TRTC，A端发布A1、A2两个视频源，在B端订阅A1、A2使用两个view进行播放渲染 问题主流视频源和辅流视频源渲染在同一view上，控制台报错 // 播放远端视频 TRTCService.js;setRemoteVideo(view) {this.trtcSdk.on(TRTC.EVENT.REMOTE_VIDEO_AVAILABLE, (event
vue2踩坑记录：el-select如何绑定对象
页面上的下拉框： 选中人员之后，需要使用人员的其它信息做后续操作。所以不能只绑定用户Id，需要绑定整个item(用户对象)，这样每次change事件所获取到的newValue是整个对象，而且v-model中的变量指向的也是整个对象，方便后续操作。 但是绑定对象后，无法正确响应，点击第一个选项时，页面显示选中的是第一个人，但是后台data是正确的。 官网有这么一句话： 原来，这时