![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue常用框架
YY小怪兽
干饭了 干饭了
展开
-
Vue-photo-preview(图片放大缩放,大图展示)
详情可见基于photoswipe的vue图片预览插件1.安装npm install vue-photo-preview --save2.配置在main.js中import preview from 'vue-photo-preview'import 'vue-photo-preview/dist/skin.css'Vue.use(preview,{ fullscreenEl: false, //控制是否显示右上角全屏按钮 closeEl: false, //控制是否显示右上角关闭按原创 2022-04-02 11:12:28 · 2918 阅读 · 1 评论 -
Vue-VConsole(在移动端显示控制台)
1.安装VConsolenpm install vconsole2.使用VCconsolemain.jsimport VConsole from 'vconsole';const vconsole = new VConsole()Vue.use(vconsole)原创 2022-03-18 13:21:04 · 707 阅读 · 0 评论 -
Vue-Velocity动画过渡
详情可见在VUE中切换路由没有任何动画效果,显得单调简陋,为了方便我们创建好看的动画效果我们可以使用Velocity插件1.安装Velocitynpm install velocity-animate2.引入Velocityimport Velocity from 'velocity-animate'3.使用Velocity <transition :css="false" @enter="enter" @leave="leave" >原创 2022-03-10 13:35:39 · 926 阅读 · 0 评论 -
Vue-IScroll(滚动、拖拽)
全文以Y轴滚动、拖拽 需要X轴只要修改一下就行了1.安装iscrollnpm install iscroll2.iscroll的基本格式详情可见<div id="wrapper"> <ul> <li>...</li> <li>...</li> ... </ul></div>3.封装iscroll注意:要满足三层结构 由于现在不知道原创 2022-03-05 15:24:11 · 1514 阅读 · 0 评论 -
Vue-lazyload(按需加载图片)
1.开发一个较大项目的时候,难免需要加载很多图片,但如果全部加载出来就会使性能降低并且当用户只看到一部分而不需要后面的图片的时候,就会浪费性能资源2.可以使用vue-lazyload按需加载1.安装vue-lazyloadm i vue-lazyload -S2.配置main.jsimport VueLazyload from "vue-lazyload";Vue.use(VueLazyload,{ //可以通过loading设置图片还未加载好之前的占位图片 loading:re原创 2022-03-05 13:55:29 · 502 阅读 · 0 评论 -
Vue-Plugin
详情可见1.Vue.use()做了什么事情?Vue.use的作用是注册一个Vue插件(注册组件), Vue.use必须在new Vue之前使用2.什么时候需要定义插件?当某一个组件或者功能经常需要被使用到时, 我们就可以将这个组件或者功能定义成一个插件例如: 网络加载指示器3.如果自定义一个插件?https://cn.vuejs.org/v2/guide/plugins.html#%E5%BC%80%E5%8F%91%E6%8F%92%E4%BB%B6 (1)在src目录下创建plug原创 2022-03-03 14:33:15 · 398 阅读 · 0 评论 -
Vue-Vant
详情可见1.什么是Vant?在使用MintUI的过程中发现有很多的坑, 所以个人不推荐在移动端中选择MintUIVant是有赞前端开发团队又推出的一款基于Vue的移动端UI框架大白话: 和Bootstrap一样对原生的HTML标签进行了封装, 进行了美化, 让我们能够专注于业务逻辑而不是UI界面2.Vant使用 https://youzan.github.io/vant/#/zh-CN/intro(1)通过 npm 进行安装 # Vue 3 项目,安装最新版 Vant npm i va原创 2022-03-01 13:54:21 · 336 阅读 · 0 评论 -
Vue-MintUI
详情可见1.什么是MintUI?MintUI是饿了么前端团队推出的一款基于Vue的移动端UI框架大白话: 和Bootstrap一样对原生的HTML标签进行了封装, 进行了美化, 让我们能够专注于业务逻辑而不是UI界面2.MintUI使用http://mint-ui.github.io/#!/zh-cn(1)推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用。 npm i mint-ui -S(2)Mint UI 的引入 在 main.js 中写入以下内容: i原创 2022-03-01 09:39:31 · 292 阅读 · 0 评论 -
Vue-ElementUI
详情可见1.什么是elementUI?ElementUI是饿了么前端团队推出的一款基于Vue的桌面端UI框架大白话: 和Bootstrap一样对原生的HTML标签进行了封装, 进行了美化, 让我们能够专注于业务逻辑而不是UI界面2.elementUI使用https://element.eleme.cn/#/zh-CN/component/installation--><!--1.elementUI优化默认情况下无论我们有没有使用到某个组件, 在打包的时候都会将element原创 2022-03-01 09:26:10 · 399 阅读 · 0 评论