随笔分类 - Vue
摘要：在开发中，如果没有动画的话，整个页面内容的显示和隐藏会非常的生硬！不好看，为了给予一定的用户体验，进入今天的主题 目录 一、Transition组件 1.Transition组件的原理 进入 离开 2、Transition组件中使用transition 代码 效果 说明 3、Transition组件
阅读全文
摘要：vueuse 是什么? 一款基于Vue组合式API的函数工具集。 以上是官方网站关于它的定义。官网地址 首先，它基于Vue Composition Api (组合式API)，只有在支持组合式API的环境下，才可以正常使用它；什么是组合式API? 然后，它是一款函数工具集（可类比为lodash.js/
阅读全文
摘要：Vue + axios + SpringBoot 2实现导出Excel 1. 前端js代码-发送Http请求 /** * 文件下载 * @param url 下载地址 * @param fileName 文件名称 * @param params 参数 */ downloadFile: functio
阅读全文
摘要：现在的流行框架，无论React还是Vue，都采用虚拟DOM。 好处就是，当我们数据变化时，无需像Backbone那样整体重新渲染，而是局部刷新变化部分，如下组件模版： <ul class="list"> <li>item1</li> <li>item2</li> </ul> 当页面中item2变为i
阅读全文
摘要：shims-vue.d.ts是为了 typescript 做的适配定义文件，因为.vue 文件不是一个常规的文件类型，ts 是不能理解 vue 文件是干嘛的，加这一段是是告诉 ts，vue 文件是这种类型的。这一段删除，会发现 import 的所有 vue 类型的文件都会报错。 /** * shim
阅读全文
摘要：vue3.0 前言： 这里分享3.0和2.0 的方法对比, nextTick 是将回调推迟到下一个 DOM 更新周期之后执行。在更改了一些数据以等待 DOM 更新后立即使用它vue3.01、引入 import { nextTick } from 'vue' 2、具体使用，配合异步 setup() {
阅读全文
摘要：对于 Vue.nextTick 方法，自己有些疑惑。在查询了各种资料后，总结了一下其原理和用途，如有错误，请不吝赐教。 概览 官方文档说明： 用法： 在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。 疑问： DOM 更新循环是指什么？ 下次更新循环
阅读全文
摘要：vue提供install可供我们开发新的插件及全局注册组件等install方法第一个参数是vue的构造器，第二个参数是可选的选项对象 export default { install(Vue,option){ 组件 指令 混入 挂载vue原型 } } 全局注册组件 import PageTools
阅读全文
摘要：正常引入方式： // 导入Vue import Vue from 'vue' // 导入路由 import Router from 'vue-router' // 导入登录组件 import Login from '@/components/login/Login' // 导入Home组件 impo
阅读全文
摘要：正常配置 import Vue from 'vue' import Router from 'vue-router' import Login from '@/components/pages/login' import Capture from '@/components/pages/captur
阅读全文
摘要：1、初始化一个新的项目 yarn init 2、添加一个依赖包 yarn add [package] yarn add [package]@[version] yarn add [package]@[tag] 3、安装所有的依赖包 yarn 或者 yarn install 4、npm 与 yarn命
阅读全文
摘要：两者核心区别就是类型提示，像定义组件需要 defineComponent 同出一辙： Vue3 import { createStore } from "vuex"; import example from './modules/example' export default createStore
阅读全文
摘要：我们在学习html的时候，图片标签<img>引入图片 <img src="../assets/images/avatar.png" width="100%"> 复制代码 但是这样会有2个弊端： 因为采用绝对路径引入，所以如果后面这张图片移动了目录，就需要修改代src里的路径 如果这张图片在同一页面内
阅读全文
摘要：一、前言最近我把项目进行了整体重构，将原先的vue和electron分为两个工程文件夹的形式融合为了一个electron-vue工程文件，因为有很大的改动，特别是环境和相关配置方面与原先的工程有很大的不同，随之而来就有很多坑，这篇文章要将的就是今天碰到的element-UI一个组件重构前显示OK但重
阅读全文
摘要：有的时候element提供的默认的样式不能满足项目的需要，就需要我们队标签的样式进行修改，但是发现修改的样式不起作用 第一种方法 原因：scoped 解决方法：去掉scoped 注意：此时该样式会污染全局样式，可以把它放在公共的css里面 为了不让所有的 el-input标签都是该样式，可以在HTM
阅读全文
摘要：VUEcreated()：在创建vue对象时，当html渲染之前就触发；但是注意，全局vue.js不强制刷新或者重启时只创建一次，也就是说，created()只会触发一次； activated()：在vue对象存活的情况下，进入当前存在activated()函数的页面时，一进入页面就触发；可用于初始
阅读全文
摘要：在项目中为了避免页面间样式污染常用scoped组件私有化，如果要改变element-ui的样式时需要用样式穿透才可复写样式。 1./deep/ 在vue3.0之前可使用，例如(复写样式前加/deep/)，vue3.0及后使用就会报错 /deep/ .el-input { width: 60px; }
阅读全文
摘要：1.概念 成对出现：provide和inject是成对出现的 作用：用于父组件向子孙组件传递数据 使用方法：provide在父组件中返回要传给下级的数据，inject在需要使用这个数据的子辈组件或者孙辈等下级组件中注入数据。 使用场景：由于vue有$parent属性可以让子组件访问父组件。但孙组件想
阅读全文
摘要：vue提供install可供我们开发新的插件及全局注册组件等install方法第一个参数是vue的构造器，第二个参数是可选的选项对象 export default { install(Vue,option){ 组件 指令 混入 挂载vue原型 } } 全局注册组件 import PageTools
阅读全文
摘要：vue install vue.use() 在vue项目中，我们可以自定义组件，像element-ui一样使用Vue.use（）方法来使用，具体实现方法： 1.首先新建一个Cmponent.vue文件 // Cmponent.vue <template> <div> 我是组件 </div> </te
阅读全文
浙公网安备 33010602011771号