vue
gooodi
这个作者很懒,什么都没留下…
展开
-
Vue.js 监听路由变化的各种方法
方法一:通过 watch 1 2 3 4 5 6 // 监听,当路由发生变化的时候执行 watch:{ $route(to,from){ console.log(to.path); } }, 或 1 2 3 4 5...原创 2019-01-28 14:44:32 · 3327 阅读 · 1 评论 -
Vue 项目中 使用 CryptoJS 对请求后端接口获得的数据实现前端加密解密
用到了axios 和CryptoJS, 基本的安装啥的就不废话了直接上封装的代码:import CryptoJS from 'crypto-js/crypto-js'import axios from 'axios';const CancelToken = axios.CancelToken// **************************** 加密代码 *******...原创 2019-07-25 13:23:33 · 1944 阅读 · 0 评论 -
Vue项目中 国际化 使用Vue-i18n 与 iview不兼容问题解决
最近在使用Vue-i18n做项目国际化, 项目中也使用了iview, 出现以下报错:查看iview源码后发现以下代码:function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var format = (0, _format2.de...原创 2019-07-16 14:17:46 · 1434 阅读 · 1 评论 -
vue中使用Echarts饼图(环状图)
在项目中步骤:<div id="pieChart" class="chart-container"></div>created () { this.initEchart()},methods: { initEchart () { axios.get('/echart').then((res) => { ...转载 2019-07-05 15:59:31 · 8015 阅读 · 0 评论 -
多行文字,最后一行显示不下省略 纯css
css 代码:多行:overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //显示的行数-webkit-box-orient: vertical; 顺便放下单行的:text-overflow: ellipsis;white-space: no...原创 2019-06-27 18:12:36 · 1121 阅读 · 0 评论 -
ios中 safari浏览器,js时间操作getTime(),getFullYear()等返回显示NaN的解决办法
查了下原因大概是:在IOS5以上版本(不包含IOS5)中的Safari浏览器能正确解释出Javascript中的 new Date('2013-10-21') 的日期对象。但是在IOS5版本里面的Safari解释new Date('2019-5-21') 就不正确,在IOS5的Safari中返回的永远是"Invalid Date"。后来我在网上查找了资料,原来是低版本的Safari解释new ...原创 2019-05-22 11:23:16 · 3058 阅读 · 1 评论 -
解析vue2.0的diff算法
前言我的目标是写一个非常详细的关于diff的干货,所以本文有点长。也会用到大量的图片以及代码举例,目的让看这篇文章的朋友一定弄明白diff的边边角角。先来了解几个点...1. 当数据发生变化时,vue是怎么更新节点的?要知道渲染真实DOM的开销是很大的,比如有时候我们修改了某个数据,如果直接渲染到真实dom上会引起整个dom树的重绘和重排,有没有可能我们只更新我们修改的那一小块do...转载 2019-03-15 10:56:46 · 213 阅读 · 0 评论 -
为什么使用v-for时必须添加唯一的key?
v-for中的key使用v-for更新已渲染的元素列表时,默认用就地复用策略;列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;我们在使用的使用经常会使用index(即数组的下标)来作为key,但其实这是不推荐的一种使用方法;举个转载 2019-02-20 15:26:41 · 339 阅读 · 0 评论 -
Vue 使用 vue-cropper实现图片裁剪
1.安装vue-cropper使用npm本地安装vue-croppernpm install vue-cropper --save-dev2.实现代码<template> <div> <div> <div class="pos movediv" :style="cutPhotomodel?'z-index:10':'z-in...原创 2019-07-26 10:03:26 · 2106 阅读 · 0 评论