关于vue2路由跳转问题记录
摘要：1. vue 路由间跳转和新开窗口的方式（query， params） 路由间跳转配置： query方式：参数会在url中显示 this.$router.push({ path: '路由地址', query: { msg: 'hello world' } }) params方式：传参数据不会在导航栏
阅读全文
posted @ 2023-06-16 15:34
随笔分类 - vue
vue技术点归纳
摘要：1.vue是什么？ vue是一套构建用户界面的渐进式框架，核心库只关注视图层。vue和react相同点： 1.都使用 virtual DOM; 2.提供了响应式(reactive); 3.组件化(composable)的视图组件； 4.都支持native方案； 5.都支持SSR服务端渲染； 6.都支
阅读全文
posted @ 2023-06-16 15:32
记录如何在vue中使用mock模拟数据
摘要：1. mock 介绍 mock： 假的。mock数据 意思是： 真的假数据。【真的即为符合接口规范要求的。 假数据：数据是自己造的，不是真实数据。】mock实现方式操作流程： 1.本地启mock服务器【用express写接口或本地用专门的mock服务】 2.线上的mock服务器mock.js基本语法
阅读全文
posted @ 2023-05-11 10:29
学习video相关事件及vue中监听切出页面方法
摘要：1.vue中监听切出页面方法 使用到的事件为： visibilitychangevisibilitychange 是浏览器新添加的一个事件，当浏览器当前页面被最小化或切换浏览器其他标签页后者从其他页面或应用返回到当前标签页 都会触发这个事件。document.visibilityState 共有四个
阅读全文
posted @ 2023-05-10 14:50
vue项目打包后，自由修改配置如接口地址等
摘要：背景描述： 项目打包后，如果想更换接口域名或者项目名称，就需要再次打包。但是这样子操作有点耗费时间。如果把这些配置写到一个文件中，然后在index.html文件中引入使用，这样子会大大提高工资效率，节省不少时间。亲测有效~~ 操作流程： 1.先在 vue项目中的 public文件夹中新建一个js文件
阅读全文
posted @ 2023-02-17 11:35
vue-seamless-scroll 组件用法-区域内容滚动效果
摘要：1.滚动效果 2.代码 <div class="page-container" style=""> <vue-seamless-scroll :data="listData" :class-option="defaultOption"> <ul class="ul-scoll"> <li v-for
阅读全文
posted @ 2023-02-15 13:47
记录web面经
摘要：1. npm版本号含义 例如： 2.3.1 (分别表示： 大版本，小版本， 补丁版本)大版本号： 大版本更新，功能添加，向下不兼容。小版本号：功能新增，向下兼容。补丁版本号： 修复bug。~符号含义： 会匹配最近的小版本依赖包。^符号含义： 会匹配最新的大版本依赖包。 2. npm安装包命令中，de
阅读全文
posted @ 2022-11-28 16:17
vue2源码学习2vuex&vue-router
摘要：1.vue插件编写 插件可以实现对象vue的拓展，比如新增全局属性/方法，添加实例方法，使用mixin混入其他配置项等等。编写插件必须要实现 install 方法，当调用Vue.use()使用插件时，会去执行插件中的install方法。该方法默认会有两个参数第一个是 Vue 的实例，第二个是配置选项
阅读全文
posted @ 2022-11-28 16:13
vue3文档学习
摘要：1.vue的核心功能及安装 1.声明式渲染2.响应性： vue会自动跟踪JavaScript状态并在其发生变化时响应式的更新DOM。安装vue3： 1.安装vue cli,下载最新版本的vue cli，并安装官方文档中的说明进行安装。 2.安装vue3依赖项安装，可使用 npm/yarn进行安装，如
阅读全文
posted @ 2022-11-23 16:36
vue2源码学习1
摘要：1.vue源码解读流程 new Vue 调用的是 Vue.prototype._init 从该函数开始 经过 $options 参数合并之后 initLifecycle 初始化生命周期标志 初始化事件， 初始化渲染函数。 初始化状态就是数据。 把数据添加到观察者中实现双数据绑定。 2.双数据绑定原理
阅读全文
posted @ 2022-11-23 16:29
vue2项目中使用 vue2-org-tree组件实现组织架构图
摘要：1. 安装及使用操作流程 npm安装：npm i vue2-org-tree 安装loader，不然会报错npm install --save-dev less less-loadermain.js文件引入并使用： import Vue2OrgTree from 'vue2-org-tree' im
阅读全文
posted @ 2022-11-14 11:38
关于使用smart-admin开发后台管理系统遇到的问题之table表格滚动条出现空白间隙如何解决
摘要：背景描述： 使用 smart-admin 开发后台管理系统；官方网址：https://gitee.com/lab1024/smart-adminView Design网址：https://www.iviewui.com/view-ui-plus/component/form/table在页面中使用
阅读全文
posted @ 2022-11-03 15:29
今日学习记录之vue3/vue2
摘要：1.vue2/vue3不同点 1.异步组件： defineAsyncComponent 例如： const asyncComponent = defineAsyncComponent( ()=> import('xxx.vue') )2.自定义指令 2.x语法 bind: 指令绑定到元素后发生，只发
阅读全文
posted @ 2022-10-10 11:32
vue中如何进行seo之Nuxt.js使用
摘要：1.seo方法一： 预渲染 第一步下载插件 prerender-spa-plugin npm install prerender-spa-plugin第二步：在vue.config.js文件中引入并进行配置vue.config.js: const PrerenderSPAPlugin = requi
阅读全文
posted @ 2022-10-06 17:02
vue3+vite+typescript
摘要：1.创建项目 npm init vite@latest <project-name> # ornpm init vite-app hello-vue3 # or yarn create vite-app hello-vue3 2. 配置端口号 以及配置别名，解决vue中 引入ref..的插件 配置端
阅读全文
posted @ 2022-09-21 11:17
在控制台使用npm init vue@latest命令报错npm ERR! Error: EPERM: operation not permitted, mkdir'xxxx'
摘要：问题描述： 在控制台中输入 npm init vue@latest 命令创建vue3项目，按照流程一步一步走， 结果发现报错 npm ERR! Error: EPERM: operation not permitted, mkdir'xxxx'。 然后百度查找原因发现，以管理者身份运行然后再次输入命
阅读全文
posted @ 2022-09-20 16:25
vuex知识点
摘要：什么是vuex？ vuex 是一个专为vue.js应用程序开发的状态管理插件。采用集中式存储管理应用的所有组件的状态，而更改状态的唯一方法是提交 mutation ,例如：this.$store.commit('SET_PAUSE',pause),SET_PAUSE 是 mutations 属性中定
阅读全文
posted @ 2022-08-10 13:56
迟到的月总结，虽然会迟但一定会到！卷...卷不动了
摘要：回首3月做过的功能以及遇到的问题点，话不多说，上代码瞅瞅~~ 1. el-table + vue 实现 table 拖拽 效果图如下：功能描述： 点击table表中的行数据，然后用鼠标就可以实现拖拽效果具体实现： // html <el-table row-key="tableNumber" //
阅读全文
posted @ 2022-04-11 19:17
前端实现JS复制功能及复制内容可换行
摘要：复制功能： function copy(codeData){ const textarea = document.createElement('textarea'); // 直接构建textarea 「注意：这里为了实现换行，需要创建textarea，如果用input的话，实现不了换行。」 text
阅读全文
posted @ 2022-02-24 14:04
2021-11-25 vscode打开代码，报红色下划线错误提示('Expected linebreaks to be LF but found CRLF')
摘要：问题描述： 用 Mac系统 搭建 vue3+vite项目，然后用 windows系统 打开这个项目。vscode编辑器里面的代码就报红色错误提示。原因就是：这是由于不同系统不同工具下，换行符不同造成的。 解决方法： 找到 eslintrc.js 文件，给 rules 里面添加 'linebreak-
阅读全文
posted @ 2021-11-25 15:28
