![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端-vue
文章平均质量分 88
乌贼さま
这个作者很懒,什么都没留下…
展开
-
vue动态修改$router参数
原文:https://blog.csdn.net/sllailcp/article/details/80312848import merge from 'webpack-merge'; 修改原有参数 this.$router.push({ query:merge(this.$route.query,{'maxPrice':'630'})}) 新增一个参数:this.$router.push({ query:merge(this.$route.query,{'a原创 2020-11-09 14:27:49 · 1461 阅读 · 2 评论 -
vue + element 音频播放控件
参考: https://github.com/wangduanduan/element-audio效果:代码:// 音乐播放组件<template> <div id='playMusic'> <audio ref='audio' :src='src' @pause="onPause" @play='onplay' @timeupdate="onTimeupdate" @loadedmetadata="onLoaded原创 2020-10-26 17:53:12 · 3462 阅读 · 0 评论 -
vue .sync修饰符实现双向数据绑定的父子组件通信
参考原文:https://blog.csdn.net/starleejay/article/details/81487124项目需要自己封装element drawer抽屉组件,写的时候发现,在父组件中修改drawerVisible = true来打开抽屉,在子组件中修改接收drawerVisible的变量值为false来关闭抽屉,发现第二次及以后无法再打开,原因在于修改子组件中drawerVisible的接收值为false并不能同时修改到父组件的drawerVisible所导致的,想要实现在子组件中修原创 2020-06-05 15:50:41 · 278 阅读 · 0 评论 -
鼠标移入移出效果demo
代码出处:https://www.bilibili.com/video/BV1Jp4y1y75i移入效果截图:移出效果截图:是一个移入移出的动画的效果,截图看不出使用vue写的,copy代码直接运行就可以了<template> <div class='container'> <h1>bilibili</h1> <form action=''> <input class='tbx' type='te原创 2020-06-03 18:46:47 · 551 阅读 · 0 评论 -
vue + element 实现 tree 树形控件
工作中遇到的需求,记录一下,效果图如下:贴上代码,直接复制就可以看到效果// 组织架构<template> <div id='newTreeView'> <div class="ntv-company"> <div class="ntvc-child"> <span>芒果财税一分公司<...原创 2020-05-07 17:16:28 · 2036 阅读 · 0 评论 -
vue前端人机验证
vue-puzzle-vcode传送门:https://www.npmjs.com/package/vue-puzzle-vcode原创 2020-04-28 10:33:57 · 2714 阅读 · 0 评论 -
vue相关
watch 深度监听watch无法监听到不是在data中定义的对象属性改变的,需要使用deep开启深度监听watch:{ showDialog: { handler(newval, old) { if (newval.show) { this.dialogVisible = newval.show this.openD...原创 2020-04-27 13:51:42 · 157 阅读 · 0 评论 -
vue+element Carousel实现幻灯片展示列表并联动时间线
工作中开发的一个小组件,使用element幻灯片展示列表,并且使用时间线展示数据所有的年份月份并根据是否支付显示不同的颜色,点击时间线上的月份可以跳转到对应的幻灯片并选中复制代码运行即可// 月结账单dialog<template> <div> <el-dialog title="月结账单" width="1230px" :visibl...原创 2020-04-26 15:45:25 · 1661 阅读 · 0 评论 -
vue draggable 使用demo
首先安装vue draggable:npm i -S vuedraggable新建一个vue文件将下面代码全部copy运行即可<template> <div class='draggable'> <vuedraggable class='v-draggable' v-model='list1' @start='startEvent' ...原创 2020-04-16 14:47:55 · 1120 阅读 · 1 评论 -
Promise
参考视频:https://www.bilibili.com/video/BV1Z7411j76r什么是Promise异步编程的解决方案,解决了回调函数嵌套的问题,提升代码可读性Promise的几种状态Promise有pending、resolved、rejected三种状态,resolved和rejected状态是不可逆的apithen()当Promise调用resolve时会执行...原创 2020-03-26 15:32:58 · 120 阅读 · 0 评论 -
vue动态标题
引入插件npm install vue-wechat-title --save-dev装载插件main.js文件中Vue.use(require(‘vue-wechat-title’))设置页面显示App.vue文件中设置路由标题原创 2020-03-17 10:55:54 · 96 阅读 · 0 评论 -
vue-router
原文地址:https://www.cnblogs.com/SamWeb/p/6610733.htmlhttps://www.jianshu.com/p/5dff6811252dvue-router实现原理SPA(single page application):单一页面应用程序,只有一个完成的页面,他在加载页面时,不会加载整个页面,而是只更新某个指定的容器中的内容,单页面应用(SPA)的核心...原创 2020-03-10 14:43:06 · 65 阅读 · 0 评论 -
判断变量的数据类型
js中共有6中基础数据类型:undefined、null、string、number、boolean、symbol(es6)和一种引用数据类型 Object判断数据类型可以使用 typeof或是instanceof但最好用的还是Object.prototype.toString.call()...原创 2020-03-02 15:28:28 · 1119 阅读 · 0 评论 -
vue中插槽的理解和使用
参考原文链接:https://www.cnblogs.com/mandy-dyf/p/11528505.html什么是插槽插槽是子组件提供给父组件使用的一个占位符,用,父组件可以在这个占位符中填充任何模板代码,如HTML,组件等,填充的内容会替换子组件中的slot标签...原创 2020-02-27 13:56:38 · 970 阅读 · 1 评论 -
前端面试题理论篇-个人整理
为什么要前后端分离后端服务器不需要再渲染页面,减轻了服务器的压力减轻开发人员的工作负担,前端专注页面,后端专注接口,提高工作效率随着前端技术发展,前端知识量与代码量越来越多,越来越复杂,需要由专业的前端人才复制开发前后端分离符合软件开发中解耦、模块化开发理念vue中router与routerouter对象是全局路由(VueRouter)的实例,有例如push(),go(),rep...原创 2020-02-20 14:43:16 · 257 阅读 · 0 评论 -
js执行机制
字符串操作字符串转数组split(’,’) 将字符串内每个字符按照引号内符号分割并返回substring / substr 切割字符串substring(startIndex, endIndex) 截取范围为两个下标之间的字符(含起始下标不含结束下标)substr(startIndex, length) 截取范围为起始下标后length位字符数组操作splice 删除/替换数组...原创 2020-02-20 11:08:14 · 172 阅读 · 0 评论 -
vue点击按钮复制内容
vue点击按钮复制内容main.jsimport VueClipboard from ‘vue-clipboard2’Vue.use(VueClipboard)使用原创 2019-12-19 14:27:18 · 487 阅读 · 0 评论