- 博客(13)
- 收藏
- 关注
RSS订阅
原创 elementUI选择器select获取选中对象
ElementUI选择器Select获取选中对象获取选中对象的指定属性Id<el-select v-model="value" placeholder="请选择区域"> <el-option v-for="item in areaLsit" :key="item.id" :label="item.Name" :value="item.id"> </el-option></el-select>有些情况下需要获取选中对象的全部数据，添加
2021-07-28 17:38:25
1539
原创 vue项目之移动端better-scroll的使用
vue项目之移动端better-scroll的使用vue项目之移动端better-scroll的使用vue项目之移动端better-scroll的使用封装better-scroll<template> <div class="wrapper" ref="wrapper"> <div> <slot></slot> </div> </div></template><
2021-07-25 14:24:59
404
原创 vue之bus总线的简单使用
vue之bus总线的简单使用vue之bus总线的简单使用vue之bus总线的简单使用场景描述：A组件中包括B，C组件，而B组件中包括D组件，这时如果D组件想要在A组件中触发C组件的方法怎么办呢？当然方案是有的，用状态管理vuex可以，用$emit传递也可以，但是我想试着用的是bus总线的方式；如下：D组件中触发bus的emit ，然后在A组件中用bus总线的on来触发方法；D组件中dataLoad(){ console.log('加载完触发事件'); this.$bus.$emi
2021-07-25 10:59:14
1048
2
原创 live-server快速搭建前端服务
快速搭建服务—前端使用场景在你写好页面之后，查看打包好的文件可以实现的功能搭建临时的服务修改文件浏览器自动刷新自动打开项目你需要做的事情是npm install -g live-serveror 使用yarn来进行安装，特点就是快不过yarn我之前遇到过很奇怪的问题，具体是怎么解决的，哈哈，当然是用的npm啊yarn global add live-server然后在项目根目录执行live-server --port=8080然后你就可以看到了如果你比较懒，可以在pack
2021-07-21 10:02:07
315
原创 vuex之多个module引入.js文件的使用方法
引用webpack中的require.context()require.context：https://webpack.js.org/guides/dependency-management/// https://webpack.js.org/guides/dependency-management/ 中的#requirecontextconst modulesFiles = require.context('./modules', true, /\.js$/)// you do not need
2021-07-19 17:22:02
842
原创 vue路由权限（3）
vue路由权限（3）vue路由权限（3）router部分store部分配置权限相关菜单组件代码如下vue路由权限（3）前面记过vue路由权限的相关内容，因公司项目中使用到的差异不大，所以还是记录一下，大概实现就不讲究，想了解的可以看之前博客内容；vue权限（1）vue路由权限（2）router部分新建index.js文件import Vue from 'vue'import VueRouter from 'vue-router'import Layout from '@/layout'
2021-07-19 11:37:48
738
原创 vue项目之自定义指令clickoutside.js的使用
vue项目之自定义指令clickoutside.js的使用vue项目之自定义指令clickoutside.js的使用vue项目之自定义指令clickoutside.js的使用这个指令是为了点击外部时触发事件，当在使用元素里面点击是不会触发的；代码如下：/* @param el 指令所绑定的元素 @param binding {Object} @param vnode vue编译生成的虚拟节点*/const clickoutsideContext = '@@clickoutsideC
2021-07-16 17:52:47
673
原创 elementUI-输入框内容太长超出怎么搞
elementUI-输入框太长超出怎么搞需求如下：// methods中写个长度的方法，这里仅选中内容展示，不做其他选择下拉使用ellipsis(value, length = 20) { if (!value) return ""; if (value.length > length) { return value.slice(0, length) + "..."; } return value;}意思是超出多少长度时，后
2021-07-14 16:23:22
4033
原创 element-ui表格组件去掉全选框
element-ui表格组件去掉全选框element-ui表格组件去掉全选框效果如下代码如下解决如下element-ui表格组件去掉全选框因项目需求，特此记录效果如下代码如下<template> <div class="content-box"> <div class="container"> <el-table ref="multipleTable" :data="tableData"
2021-07-08 16:34:32
6318
2
原创 vue项目之svg封装使用
vue项目之svg封装使用vue项目之svg封装使用SvgIcon文件index.vue封装Item.vueicons文件下新建svg和index.jsmain.js中引入使用vue.config.js中配置svgpackage.json文件安装必须的包组件页面使用vue项目之svg封装使用SvgIcon文件index.vue<template> <div v-if="isExternal" :style="styleExternalIcon" class="svg-extern
2021-07-08 09:03:02
829
1
原创 vue项目之html2canvas.js的使用示例
vue项目之html2canvas.js的使用html2canvas.js的使用封装页面使用html2canvas.js的使用html2canvas可以通过获取HTML的某个元素，然后生成Canvas，能让用户保存为图片。npm包地址 - html2canvashtml2canvas-configuration封装export function htmlToCanvas(el, backgroundColor = 'rgba(0,0,0,.1)') { return new Promise(
2021-07-05 18:21:11
1514
原创 vue项目之自定义指令防抖
vue项目之自定义指令防抖vue项目之自定义指令防抖utils.js中封装防抖函数directiv.js 自定义指令页面使用自定义指令效果如下vue项目之自定义指令防抖utils.js中封装防抖函数/** * @desc 防抖 * @param {Function} func * @param {number} wait * @param {boolean} immediate * @return {*} */export function debounce(method, wait,
2021-07-01 15:30:42
639
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人