随笔分类 -  vue

vue局部路由守卫使用
摘要：vue全局路由守卫，一般用在登录token进行判断，这个场景比较常见，就不再记录 现在有一个场景就是移动端导航栏进入到另一个界面再返回到导航栏的界面，会重定向到首页。 比如这个界面进入到岗位信息/我的收藏/我的发布/意见反馈界面再按返回(这里我没有进入的界面的路由嵌套在导航栏里)，这个会返回到首页界 阅读全文
posted @ 2021-07-29 11:28 皮皮马y 阅读(705) 评论(0) 推荐(0)
记一次关于vantUI 下拉列表list加载数据的问题
摘要：因为是第一次用vantUI所以很多地方还不是很熟，这个vant-list列表加载数据又需要在很多地方用到，这里记一下正确的用法。。 这里先说一下会遇到的问题。 会无限请求接口 列表不会滚动始终只展示第一页的数据 贴组件代码 <template> <van-pull-refresh v-model=" 阅读全文
posted @ 2021-07-19 14:06 皮皮马y 阅读(2344) 评论(0) 推荐(0)
vue中使用require动态拼接img路径
摘要：一般情况下，我们在使用require存放一个图片地址时，都是这么写： <img width="100%; height: 100%" :src="bannarsrc" /> <script> data () { return { bannarsrc: require('@/assets/images 阅读全文
posted @ 2021-07-13 18:19 皮皮马y 阅读(4450) 评论(0) 推荐(0)
记录一次关于el-tree中让内容与左边有距离的爬坑记录
摘要：首先看设计文稿如下 可以看到tree的内容与左边有一个88px的间距，起初看到觉得很容易，给容器加一个padding-left: 88px就可以了。可是似乎并没那么简单。。。 /deep/.el-tree-node__content { padding-left: 88px !important; 阅读全文
posted @ 2021-06-04 19:07 皮皮马y 阅读(1911) 评论(3) 推荐(0)
postcss-pxtorem插件相关配置
摘要：功能作用：将px像素自动转化为rem。 首先安装postcss-pxtorem。 1 npm install postcss-pxtorem -D 新建一个postcss.config.js文件配置。 1 module.exports = { 2 plugins: { 3 // 兼容浏览器，添加前缀 阅读全文
posted @ 2021-05-25 11:22 皮皮马y 阅读(3244) 评论(1) 推荐(0)
vue3.0混合API的使用(二)
摘要：vue2.x存在的问题 在vue2.x中，对一个功能模块的处理一般是将数据定义在data中，方法定义在methods。如果这个页面内容方法过多，就不太利于代码阅读和维护。 vue3.0推出使用混合API 在vue3.0中，可以使用setup函数，将变量和方法都写在这个函数中，还可以将这个功能模块抽离 阅读全文
posted @ 2021-01-13 10:55 皮皮马y 阅读(426) 评论(0) 推荐(0)
vue3.0的优化(一)
摘要：vue3性能优于vue2.x，主要原因有以下四点： 一、diff算法优化： vue2.x的虚拟DOM是进行全量比较。 vue3新增了静态标记（PatchFlag）。 在于上次虚拟节点进行比较的时候，只比较带有静态标记的节点，减少了比较的次数。 使用vue3创建工具查看一下创建结构 export fu 阅读全文
posted @ 2021-01-07 16:22 皮皮马y 阅读(938) 评论(0) 推荐(0)
element-UI下拉框设置为multiple，首次进入表单页面就触发检验事件的bug
摘要：起因：今天在做一个功能模块的时候，给一个表单加了验证，有一个下拉框设置为多选multiple属性，在加入验证之后，首次打开这个窗口，就会触发一次验证。 验证代码： appraisalcategoryid: [ { trigger: 'change', required: true, message: 阅读全文
posted @ 2020-12-17 09:51 皮皮马y 阅读(2337) 评论(0) 推荐(0)
vue组件的封装
摘要：vue一个非常重要且实用的特点就是组件化。 一、什么是组件化？ 通俗来说就是在一个项目中，有一个组件A，要在多个页面中使用A，那么如果在每个页面都来写这多个组件的组合肯定是一种非常低效率的方法，所以最优解是单独对这多个组件进行封装，通过子父组件的传值来实现高复用的组件功能，这就是组件化。 二、封装组 阅读全文
posted @ 2020-10-09 11:00 皮皮马y 阅读(5385) 评论(0) 推荐(0)
去掉eslint代码校验
摘要：找到.eslintrc文件，去掉extend下面的'@vue/standard'。 阅读全文
posted @ 2019-08-02 09:45 皮皮马y 阅读(2321) 评论(0) 推荐(0)
vue引用bootstrap3
摘要：引用bootstrap yarn add bootstrap@3 基于jquery，因此还需要引用2个包，jquery和popper.js， yarn add jquery popper.js -S 引用完后在项目中创建一个配置文件(跟package.json同级)，命名vue.config.js， 阅读全文
posted @ 2019-07-26 14:43 皮皮马y 阅读(2005) 评论(0) 推荐(1)
创建vue3项目
摘要：最近准备做一个vue的小项目关于vue3的使用。 首先在vscode全局安装vue脚手架，npm i -g @vue/cli。 然后创建vue项目，vue create mydemo(项目名)。 接下来就是选择一些安装的事项 这里推荐选择自定义安装，选择如下几个(如果会用typescript就把这个 阅读全文
posted @ 2019-07-25 15:08 皮皮马y 阅读(11090) 评论(0) 推荐(2)