Vue
文章平均质量分 74
土豆Coder
博客只是为了记录我的学习工作求职之路所见
知识点的搬运工
毕业CQU 自动化专业 自学前端
热爱美食 火锅 羽毛球
前端之路继续走 想学的东西还特别多
学英文 学吉他 梦想有朝一日能成为羽毛球大咖 杀球吊球嘎嘎牛
人生理想就是怎么吃美食都吃不胖 怎么写bug都不会秃
嗝 今天的胃又是128G的噢~~~
展开
-
vue-cli创建自定义preset预设项目
一个自定义vue preset项目包含了新建项目所需的所有默认配置和内容,节省了反复配置的过程原创 2023-11-09 11:32:40 · 404 阅读 · 0 评论 -
vue2+vue-quill-editor富文本域
vue+vue-quill-editor实现富文本域功能原创 2023-05-24 17:38:39 · 366 阅读 · 0 评论 -
vue2+wangeditor富文本域
vue2+wangeditor实现富文本域功能,支持自定义功能项,图片放大缩小原创 2023-05-24 15:44:53 · 1054 阅读 · 0 评论 -
vue2.x项目中ts写法
使用 vue-cli 直接生成的 vue2+ts 项目中,如何使用ts语法编写vue组件原创 2023-01-13 13:48:47 · 609 阅读 · 0 评论 -
Vue3响应式原理设计和实现
响应式是一个过程,这个过程存在两个参与者:一方触发,另一方响应。触发者:数据响应者:引用该数据的函数(也叫副作用函数)原创 2022-12-15 16:15:46 · 335 阅读 · 0 评论 -
Vue-router 中 hash 和 html5 两种路由监听方式
如果你用过 Vue,那你一定知道 vue-router,它给开发者提供了两种路由方式。这两种不同模式的路由方式,它们对路由的监听方式也不同。原创 2022-12-15 10:12:10 · 1685 阅读 · 0 评论 -
Vue插槽slot的使用
Vue插槽slot的使用插槽slot匿名插槽具名插槽作用域插槽其他插槽slot插槽的设计是抽取共性,保留不同,并将不同的地方通过 slot 作为承载分发出去匿名插槽// Article.vue<template> <div> <p>具体说明是什么看你插槽的内容是什么</p> <slot></slot> </div></template>// Home.vue<tem原创 2022-04-18 11:16:33 · 595 阅读 · 0 评论 -
defineProperty和proxy区别
从defineProperty和proxy区别理解vue2和vue3原理区别劫持(监听)方式不同defineProperty 劫持对象proxy 劫持对象欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入原创 2022-04-12 11:43:54 · 4572 阅读 · 8 评论 -
从eleUI的Loading知道了单例模式
多个请求的时候没有显示后面的loading,单例模式导致原创 2019-10-08 10:21:16 · 925 阅读 · 1 评论 -
Vue组件嵌套生命周期
Vue组件嵌套生命周期原创 2021-05-06 15:17:47 · 210 阅读 · 0 评论 -
vue的mixin的理解和应用场景
vue的mixin的理解和应用场景介绍使用局部混入全局混入注意介绍mixin作为功能模块的使用,在需要该功能时“混入”,有利于代码复用又避免了多继承的复杂。官方对mixin的定义mixin(混入),提供了一种非常灵活的方式,来分发vue组件中的可复用功能。其本质就是一个js对象,可以包含我们组件想要复用的任意功能和生命周期,如:data、created、methods、computed等等。使用局部混入// 新建 mixin.jslet myMixin = { created: fun原创 2020-12-18 16:43:14 · 2451 阅读 · 3 评论 -
Vue组件间通信方式
Vue组件间通信方式介绍通信分类props数据传递$emit事件触发使用ref事件总线EventBusEventBus1EventBus2(全局EventBus)EventBus移除parent或rootattrs与listenersProvide与InjectVuex介绍在使用Vue开发项目时,每一个.vue文件都可以被视作一个组件,Vue组件间通信就是这些.vue文件之间通过某种方式进行数据传递,达到信息同步和共享的目的。通信分类常见的组件通信的场景有以下几种父子组件间通信兄弟组件间通信原创 2020-12-17 11:08:00 · 143 阅读 · 0 评论 -
vue.config.js配置本地,测试,开发环境变量
vue.config.js中如何配置本地,测试,开发环境背景环境配置本地环境测试环境线上环境package.json配置运行开发环境测试环境线上环境注意背景当我们使用vue-cli3.0搭建项目时,相比于之前的vue-cli2.0少了build于config文件夹,所以vue-cli3.0提供了一个可选的配置文件----vue.config.js来对项目进行webpack的配置。最典型的一个配置就是接口配置,如:// vue.config.jsmodule.exports = { // 是否生成原创 2020-09-14 15:57:17 · 3848 阅读 · 2 评论 -
从零搭建vue组件库并发布
从零搭建vue组件库背景步骤1、安装vue-cli创建项目2、目录改造3、创建组件4、指定main5、发布后续背景之前写过一个vuepress编写API文档verdaccio搭建并发布组件库的博客,可以发布组件,但是存在一个问题,就是进入Wui目录(也就是我们的组件库)里面安装的依赖自定义组件是访问不到的所以这种组件只适合单纯的组件,如果我们想要依赖另外的组件需要重新搭建一个单纯的组件库,这里的单纯的意思是和我们vuepress搭建的API文档文档,当我们在vuepress中需要针对我们的组件库写文原创 2020-09-08 14:45:18 · 497 阅读 · 0 评论 -
vue点击当前路由刷新
vue点击当前路由刷新背景实现方案provide / injectApp.vue空白页中转背景这里的当前路由刷新当然不是简单的当前页面的刷新。如果使用❌location.reload()❌this.$router.go(0)其实最终效果都是刷新了当前浏览器页面,就像你手动F5的效果,这当然不是我们想要的效果,会有闪屏,用户体验不够友好(你试试就知道了)。我们想要的效果应该是下图所示的亚子(就像在走前端路由那样):实现方案provide / inject这对选项需要一起使用,以允许一个祖原创 2020-08-27 09:55:06 · 1904 阅读 · 1 评论 -
vue3.x自定义换肤
可以使用elementUI官网给出的方案多个皮肤之间的换肤使用插件进行自定义换肤原创 2019-10-08 11:10:24 · 1398 阅读 · 0 评论 -
Vue项目build打包webpack优化
webpack-bundle-analyzer打包分析工具1、首先安装模块npm i webpack-bundle-analyzer -D2、在Vue-Cli3中配置// vue.config.jsconst BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPluginmodule.e...原创 2019-11-13 17:02:01 · 2914 阅读 · 2 评论 -
vue中将页面导出为.pdf和.html
vue中将页面导出为pdf介绍导出为.PDF导出为.htmlConclusion介绍如果项目中包含报表业务,通常都会有导出功能。根据不同需求导出为不同格式导出,有PDF、Excel、Word格式等…当然,导出的方法也有很多,一般都是后端导出前端直接点击下载即可,但是是不是前端就不能实现导出功能呢,也不是。这里,就在vue项目中使用已有的依赖包来实现导出功能。导出为.PDF// step 1...原创 2020-02-25 11:07:30 · 2693 阅读 · 0 评论 -
vue和react多语言配置
vue和react多语言配置介绍`vue`+`i18n`多语言项目新建和依赖安装定义多语言配置文件在入口文件中引入并使用`.vue`文件中使用多语言在`.js`文件中使用多语言`react`+`react-intl`多语言新建项目并安装依赖包入口文件中引入`.js`文件中使用介绍现在越来越多的项目需要支持多语言,熟悉Vue开发的同学应该知道在Vue中配置多语言还是比较简单的,基本都用的是i18...原创 2020-01-03 16:19:58 · 296 阅读 · 0 评论 -
(下)vuepress编写API文档verdaccio搭建并发布组件库
从零开始原创 2019-10-10 15:18:41 · 1282 阅读 · 0 评论 -
(上)vuepress编写API文档verdaccio搭建并发布组件库
搭建私有Vue前端组件库原创 2019-10-28 11:58:39 · 2919 阅读 · 2 评论 -
vuex简单易懂
新建vuex实例// store.jsimport Vuex from 'vuex'const store = new Vuex.Store({ })export default store入口文件中引入// main.jsimport store from './store.js'new Vue({ el: '#app', store, . . .})Sta...原创 2019-07-14 20:28:21 · 177 阅读 · 0 评论