
Vue系列
文章平均质量分 84
Vue系列
程序员小严
公众号:【Java星探】、毕业设计、定制化开发、商业合作可联系博主。
展开
-
如何将阿里巴巴矢量图标库iconfont引入到vue项目中?
当我们使用一款前端UI的时候,图标的使用必不可少,但是单单一个UI的图标有时候无法满足我们的需求,那么我们可以到阿里巴巴矢量图标库iconfont里面去寻找,作为一个程序员,怎么把它做成通过代码的方式使用呢?想了解更多的微服务架构实践吗?关注公众号【Java星探】,加入MicroAdmin开源社区,与我们共同打造高效、灵活的微服务应用。这里有丰富的技术干货,公司架构实战、最新的项目动态,更有机会与开发者们一起交流、成长。原创 2024-12-25 15:49:19 · 1006 阅读 · 0 评论 -
Vscode插件Vue VSCode Snippets生成Vue模板代码使用大全
Vue VSCode Snippets插件前言一、Vue VSCode Snippets插件安装二、使用步骤1.生成vue基本模板代码2.自定义模板3.常用快捷键总结前言最近使用了Vscode编辑器写Vue前端代码,发现很坑,很多东西都不会提示,而且超级难找,所以这里记录一下小编的初使用过程中遇到的坑。一、Vue VSCode Snippets插件安装这里小编第一次安装完成之后,发现他的一些命令根本不生效,我重启了Vscode还是没啥反应,解决方式:查看底部的状态栏当前的语法格式:如果是原创 2021-05-23 15:17:45 · 21275 阅读 · 3 评论 -
如何使用Vue集成其它UI组件?如何阅读UI官网?移动端组件Vant实例教程(熬夜干货)
如何使用Vue集成其它UI组件前言一、Vant是什么?二、基础环境准备1.1 了解是根本1.2 安装1.3 引入组件3.1 步骤一3.2 步骤二3.3 步骤三二、事件绑定2.1 引入2.2 编写页面代码2.3 通用Events事件三、参数传递总结前言首先,我是一个全栈小白,我的前端很菜,我本就是一个后端开发者,凭啥写前端的东西,我也很纳闷,公司本来说我写接口就可以了,然而呢?生活就是如此,套路啊!你可以不信我的教程,但不能不相信官网,哈哈哈,很多初学vue的小伙伴,肯定会有这样的疑问,如何使用Vue集原创 2021-05-14 00:20:54 · 749 阅读 · 3 评论 -
Vue使用Element-ui按需引入大坑
vue使用element-ui按需导入大坑前言一、element-ui按需导入二、卸载element-ui 重装三、正确卸载步骤总结前言element-ui按需导入小编使用了vue add element的方式,结果重新渲染app.vue入口组件,大大的bug,这是很严重的,比如我之前在app.vue里面配置了很多东西,写了很多函数,如果没有备份一下子就没了。一、element-ui按需导入终端输入:vue add element 可以看到让我们选择全部引入还是按需引入,此时我们选择按需引原创 2021-01-30 01:24:50 · 2164 阅读 · 8 评论 -
史上最全基于vue的图片裁剪vue-cropper使用
这里写自定义目录标题基于vue的图片裁剪vue-cropper新的需求vue-cropper官网代码拷贝如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入基于vue的图片裁剪vue-cropper最近小编好久没有写博客了,今天发现突然涨了好几个粉,特别的开心,为了回馈大家原创 2020-11-17 15:49:33 · 71863 阅读 · 66 评论 -
Vue系列Vue-cli 4配置别名(六)
前言vue-cli3或者4中使用脚手架创建的项目,没有webpack.base.config.js文件,那么咋搞?手动创建呗? 就可以配置一些额外的操作了,如何配置别名呢,直接上手吧。一、创建vue.config.js文件注意:vue.config.js与src在同一个目录哦,也就是在你项目名称第一个目录下,你就可以创建这个文件夹了。二、编写vue.config.js代码const path = require('path'); //引入path模块function resol原创 2020-07-25 12:41:42 · 4049 阅读 · 2 评论 -
Vue系列vue-router的参数传递的两种方式(五)
前言在上面的文章当中,小编已经使用过route.params的方式传递参数了,下面我们再来学习一种route.query参数传递的方式。一、编写Profile页面二、编写App.vue入口普通的写法<router-link v-bind:to="{path: '/profile',query: {name:'summer-少年',age:18,sex:1,email:'1973984292@qq.com'}}" tag="button" replace>档案</router-l原创 2020-07-24 16:20:22 · 557 阅读 · 0 评论 -
Vue系列vue-router的嵌套使用(四)
前言我们希望点击导航栏不同菜单时,导航栏下方加载不同的组件,进而展示不同的页面内容,下面我们来模拟一下这个场景一、编写两个路由子页面Welcome页面相当于导航下方的菜单,菜单下面的两个子页面,相当于,不同的子菜单链接页面。二、配置路由规则代码:{ path: '/welcome', component: Welcome, children: [ { path: '', redirect: 'news' },原创 2020-07-23 21:05:46 · 211 阅读 · 0 评论 -
Vue系列vue-router的项目打包(三)
前言项目生产上线,打包必不可少,那么我们就来看一下Vue是如何项目打包的。一、打包命令npm run build打包成功之后会给我们生成一个dist文件夹,里面有css、js等相关的代码分层打包。打包出来的js简单说明:二、路由赖加载官方:https://router.vuejs.org/zh/guide/advanced/lazy-loading.html当打包构建应用时,JavaScript 包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路原创 2020-07-23 20:30:37 · 1402 阅读 · 0 评论 -
Vue系列vue-router的动态路由使用(二)
前言首先我们来看看官方文档上是怎么解释动态路由的?走你你可以在一个路由中设置多段“路径参数”,对应的值都会设置到 $route.params 中。例如:除了 $ route.params 外,$ route 对象还提供了其它有用的信息,例如,$ route.query (如果 URL 中有查询参数)、$ route.hash 等等。你可以查看 API 文档 的详细说明。一、什么场景下使用动态路由呢?比如在写用户详情页面的时候,页面结构都一样,只是用户id的不同,所以这个时候就可以用动态路由动原创 2020-07-23 19:35:20 · 1912 阅读 · 0 评论 -
Vue系列vue-router的配置使用(一)
前言因为Vue目前市场比较火,企业也在大量使用,很多后端小伙伴面试的时候,可能也遭遇到了毒打,明明是后端开发,为何还要要求会Vue呢?相信大家也知道,很多时候后端开发人员都是会点前端知识的,这样大家配合工作的效率相对而言就比较高,说白了,都会一点有啥不好,废话不多说啊,向全栈奔跑就完了。一、效果大图首先如何使用vue-cli3创建Vue项目脚手架,小编在其他课程里面也有写过,不懂的自信翻阅,该demo使用vue-cli创建。业务说明:默认网站首页,点击按钮或者链接能够跳到不同的页面。1、网站默认首原创 2020-07-23 18:39:39 · 578 阅读 · 0 评论 -
史上最详细Vue-CLI脚手架快速创建Vue项目教程
前言Vue CLI是用于快速Vue.js开发的完整系统。俗称Vue CLI脚手架,是一套大众化的前端自动化解决方案,他的核心是 webpack ,框架是vue,还有相关辅助插件组成。准备环境,安装Vue CLI安装步骤省略,输入命令 vue -V 输出如下版本信息,即安装成功了,提示:2.0以下版本是没有提供图形化界面的,只能通过命令创建。使用参考文档1、https://cli.vuejs.org/guide/2、https://cli.vuejs.org/zh/dev-guide/plugi原创 2020-07-05 01:05:50 · 1956 阅读 · 0 评论