Vue
文章平均质量分 80
ydongabc
这个作者很懒,什么都没留下…
展开
-
vue引入图片url变量
1.引入方式普通引入<template> // 普通引入 <img src = "../assets/images/01.jpg"> // webpack编译处理后: <img src = "/img/01.f0afc36d.jpg"><template>变量引入<template> ...原创 2020-04-26 21:05:00 · 5781 阅读 · 1 评论 -
element表格在前端对全部数据进行排序
1.对全部数据进行排序,需要对el-table绑定sort-change监听<el-table :data='tableData' @sort-change='sort_change'>sort-change绑定方法具有参数:column,这是一个对象:column: { prop: 'xxxx', // el-table-column中的prop order: 'x...原创 2019-11-24 19:02:22 · 3948 阅读 · 3 评论 -
表格分页展示+搜索功能
1.html部分使用了element的组件<template> <div> <!-- 表格 --> <el-table :data="search(input_box)"></el-table> <!-- 分页栏 --> <el-pagination :total="pa...原创 2019-11-24 19:01:48 · 516 阅读 · 0 评论 -
vue导航跳转报错
报错信息:Navigating to current location (“/…”) is not allowed (不允许导航到当前位置"/…")在控制台中看到的错误是新的promise api的一部分:在此之前,如果没有回调提供给router.push,错误只会发送给全局路由器错误处理程序。现在,因为推送和替换都会返回一个承诺,如果没有捕获到导航失败(任何取消导航的操作,如next(fal...原创 2019-11-05 17:27:11 · 1070 阅读 · 0 评论 -
vue项目中使用 echarts 统计图
1.安装echarts依赖$ npm install echarts -s2.main.js全局引入// 引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts3.创建一个存放图表的容器<div id="chartbox"></div>4.绘制图表export de...原创 2019-11-05 15:36:16 · 2745 阅读 · 1 评论 -
时间格式转换方法
将 毫秒级 转换为 年月份1.函数转换function dateFormat(timestamp) { var date = new Date(timestamp ); //时间戳为10位需*1000,时间戳为13位的话不需乘1000 var Y = date.getFullYear() + '-'; var M = (date.getMonth()+1 < 10...原创 2019-11-05 15:35:10 · 223 阅读 · 0 评论 -
利用 scoped 穿透修改子组件或第三方ui组件样式
父组件添加scoped后,将无法修改子组件或第三方ui组件(element、iview)样式,通过v-html创建的dom内容也不受作用域内的样式影响,可用scoped穿透解决:<style scoped>/* style的样式穿透使用 >>> */外层 >>> 第三方组件 { 样式}.a >>> .b{ ...原创 2019-11-05 15:32:57 · 150 阅读 · 0 评论 -
利用 keep-alive 实现vue页面返回记住滚动条上次浏览位置
<keep-alive> 标签:是Vue的内置组件,能在组件切换过程中将状态保留在内存中,取消组件的销毁函数,防止重复渲染DOM。当用它包裹 <router-view> 时,会缓存不活动的组件实例,而不是销毁它们。和 <transition> 相似,它自身不会渲染一个 DOM 元素。使用 <keep-alive> 组件后即可使用 activa...原创 2019-11-04 12:38:24 · 1838 阅读 · 0 评论 -
前端数据分页展示方法原理
对数据数组使用 slice() 方法v-for="item in data.slice((currpage - 1) * pagesize, currpage * pagesize)"data(){ return { currpage: 1, //当前页码 pagesize: 10, //每页展示数目 }}切换页面时动态传值更改 currpage 即可...原创 2019-11-04 12:37:52 · 447 阅读 · 0 评论 -
vue-preview 缩略图片查看器插件
功能:手机端点击图片查看大图使用方法:1.装包:$ cnpm i vue-preview -s2.main.js引入import VuePreview from 'vue-preview'Vue.use(VuePreview)3.组件 <div class="thumbs"> <vue-preview :slides="数组数据list...原创 2019-11-04 12:36:37 · 162 阅读 · 0 评论 -
vue控制滚动条位置
应用场景:滚动条复原、页面加载完成后滚动到指定位置。1.在router.js中添加如下代码export default new Router({ routes:[], scrollBehavior (to, from, savedPosition) { if(savedPosition){ return savedPositi...原创 2019-11-04 12:32:39 · 7209 阅读 · 0 评论