随笔分类 -  Vue

Jquery (jquery.countup) 动画插件实现数字滚动增加动画
摘要：首先html页面中head内引入所需的js文件 jquery.min.js waypoints.min.js countup.min.js 3.使用<span>元素作为数字的容器。 1 <span class="counter">1,498,547.00</span> 2 <span class=" 阅读全文
posted @ 2022-08-23 18:10 MELANCHOLYS 阅读(927) 评论(0) 推荐(0)
moment.js随机生成指定日期或时间
摘要：import moment from 'moment'; const randomDate = () => { // 随机生成0-11的数字 const randomMonthNum = Math.floor(Math.random() * 11); // 随机生成1-30数字 const rand 阅读全文
posted @ 2022-08-22 10:26 MELANCHOLYS 阅读(894) 评论(0) 推荐(0)
外部js调用vue事件方法
摘要：将methods里面定义的方法, 需要赋值给window，外部js就可以调用了 export default { name: "HelloWorld", props: { msg: String, }, mounted() { // 将vue中的方法赋值给window window.handleCl 阅读全文
posted @ 2022-08-03 16:59 MELANCHOLYS 阅读(771) 评论(0) 推荐(0)
vue2设置浏览器icon图标
摘要：1.在index.html文件head标签内设置（图片要放在static静态资源文件夹内，防止打包之后文件图片找不到） <link rel="shortcut icon" href="./static/images/logo.png" type="image/x-icon" /> 2.在build/ 阅读全文
posted @ 2022-06-28 21:47 MELANCHOLYS 阅读(1391) 评论(0) 推荐(0)
前端打包时出现node内存溢出问题
摘要：前端项目打包编译时出现以下情况： 原因： 在Node中通过JavaScript使用内存时只能使用部分内存（64位系统：1.4 GB，32位系统：0.7 GB），这个时候，如果前端项目非常的庞大，Webpack编译时就会占用很多的系统资源，如果超出了V8引擎对Node默认的内存限制大小时，就会产生内存 阅读全文
posted @ 2022-02-11 22:05 MELANCHOLYS 阅读(1766) 评论(0) 推荐(0)
vue使用VueOkrTree实现组织架构树组件
摘要：最近做项目中给了一个需求需要实现一个类似于思维导图的组织架构树组件,就在网上找，发现一个大佬个人写的一个组件，非常好用。 作者demo演示地址 1.下载 # use npm npm i vue-okr-tree # use yarn yarn add vue-okr-tree 2.引入（可以在需要用 阅读全文
posted @ 2021-07-09 17:43 MELANCHOLYS 阅读(2738) 评论(0) 推荐(1)
Vue使用AES加密（ECB，CBC）
摘要：这里介绍AES加密的两种模式：ECB模式 CBC模式。 此次后端与我商量用到了 AES加密之后，再将密文转成Base64格式，使用双加密模式。 // base64 npm install --save js-base64 或者 cnpm install --save js-base64 // AES 阅读全文
posted @ 2021-06-30 14:43 MELANCHOLYS 阅读(2900) 评论(0) 推荐(0)
css实现边框动画
摘要：<div class="box"> <div class="yespost">Hover</div> </div> <style> #box{ width: 200px; margin: 500px auto; } .yespost { width: 100%; height: 80px; text 阅读全文
posted @ 2021-06-25 19:08 MELANCHOLYS 阅读(542) 评论(0) 推荐(0)
Vue中关闭当前页面
摘要：原生写法 window.opener=null; window.open('',self); window.close(); vue中写法（在事件中写入） window.opener = null; window.open("about:blank", "_top").close() 阅读全文
posted @ 2021-06-25 18:39 MELANCHOLYS 阅读(13764) 评论(0) 推荐(0)
vue中this.$set的使用
摘要：this.$set原理讲解 vue官方实例 this.$set的具体使用：table表格中需要更改表格中的值，还必须保证是响应式（双向数据绑定） 这时候就可以考虑此方法 举个栗子：$set，ant-design Of vue中表格的使用 vue组件中template标签内 <div> <a @cli 阅读全文
posted @ 2021-06-24 11:19 MELANCHOLYS 阅读(536) 评论(0) 推荐(0)