vue
舟遥遥
舟遥遥---写给自己的,如果恰巧帮助到了别人,就再好不过了
展开
-
vue2 打包报错 in ./src/main.js Thread Loader (Worker 0) Cannot read property ‘length‘ of undefined
vue2 项目可正常运行,打包报错in ./src/main.js Thread Loader (Worker 0) Cannot read property ‘length’ of undefined。vue-cli 使用 wokrer-loader 加载 web woker 时,使用 npm run build 有很大机率会打包失败。在vue.config.js 配置parallel: false,可以实现构建正式环境关闭thread-loader。原创 2024-03-01 08:48:05 · 379 阅读 · 0 评论 -
cesium vue 天地图 WMTS图层数据 绘制点、线、面 测距、测面积
cesium vue 天地图 WMTS图层数据 绘制点、线、面 测距、测面积原创 2023-03-29 14:51:02 · 1235 阅读 · 1 评论 -
vue :class
:class<div :class="{ active: isActive }"> {{ isActive }}</div><div :class="{ active: isActive, name1: nameActive }"> {{ isActive }}~{{ nameActive }}</div><div :class="nameActive ? 'name1' : 'name2'"> {原创 2020-11-25 10:00:46 · 244 阅读 · 0 评论 -
element 、 vant 时间区间设置
element (PC端)<el-date-picker type="date" placeholder="选择日期" v-model="form.checkTime" format="yyyy年MM月dd日" value-format="yyyy-MM-dd" :picker-options="pickerOptions" ></el-date-picker>data() { return { //原创 2020-11-17 09:02:36 · 1823 阅读 · 0 评论 -
vuex
一、Vuex是什么 Vuex是专门为Vuejs应用程序设计的状态管理工具。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。1、Vuex的构成 由上图,我们可以看出Vuex有以下几个部分构成:1)statestate是存储的单一状态,是存储的基本数据。2)Gettersgetters是store的计算属性,对state的加工,是派生出来的数据。就像computed计算属性一样,getter返回的值会根据它的依赖被缓存起来,且只有当转载 2020-05-27 08:46:47 · 152 阅读 · 0 评论 -
watch和computed
1. 各自处理的数据关系场景不同watch擅长处理的场景:一个数据影响多个数据 ,当需要在数据变化响应时,执行异步操作,或高性能消耗的操作,自定义 watcher 的方式就会很有帮助。computed擅长处理的场景:一个数据受多个数据影响 ,可以关联多个实时计算的对象,当这些对象中的其中一个改变时都会出发这个属性。具有缓存能力,所以只有当数据再次改变时才会重新渲染,否则就会直接拿取缓存中的数据。2. 工作流程watch1.初始化组件上配置的watcher属性2.对watcher属性可能的写原创 2020-05-20 16:13:10 · 227 阅读 · 0 评论 -
viewerjs 按钮可见性设置
viewer.js插件(图片预览) GitHub地址:https://github.com/fengyuanchen/viewerjs。如:不显示1:1,横向旋转,竖向旋转的按钮效果图:Viewer.setDefaults({ toolbar: { zoomIn: true, zoomOut: true, oneToOne: false, r...原创 2020-01-08 18:08:03 · 2750 阅读 · 0 评论 -
$set()处理数据更新但视图不更新的问题
踩了一个坑,给对象加完属性,打印出来了,但是页面没渲染出来。原因是:受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。要处理这种情况,可以使用$set()方法,既可以新增属性,又可以触发视图更新。调用方法:Vue.se...原创 2020-01-04 16:14:15 · 2113 阅读 · 0 评论 -
css3滑动出现工具栏
效果图(gif有延迟,真实效果很流畅,拍gif截图的软件名为:GifCam):代码(关键注释在css里):<template> <div class="test3-container"> <div class="test3-bg" :class="{ show: show }"></div> <div clas...原创 2019-10-10 10:34:30 · 552 阅读 · 0 评论 -
vue修改el-table的样式,标题,列文字位置,颜色,流体高度,气泡
<template> <div class="test1-container"> <el-table :data="tableData" style="width:550px;margin:0 auto;margin-top:30px;" border :row-style="tableRowStyle" :header-cell-st...原创 2019-06-11 16:20:05 · 19733 阅读 · 6 评论 -
node遍历文件夹并读取文件内容
var fs = require('fs');var path = require('path');//解析需要遍历的文件夹var filePath = path.resolve('./dist');//调用文件遍历方法fileDisplay(filePath);//文件遍历方法function fileDisplay(filePath){ //根据文件路径读取文件,返回文件...转载 2019-07-23 13:31:01 · 1304 阅读 · 0 评论 -
reduce
1、语法array.reduce(function(total, currentValue, currentIndex, arr), initialValue)reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。callback (执行数组中...转载 2020-11-12 15:21:51 · 2431 阅读 · 0 评论 -
图片预览
写一个图片预览的组件<template> <div class="wrapper" :style="{height:wrapperHeight}"> <div class="imgName"> <span class="left"> {{imgIndex}} / {{imgData.length}}<...原创 2018-07-11 15:52:26 · 186 阅读 · 0 评论 -
给数组中所有对象加一个属性
新数组:array;原数组:list;给原数组list的对象加一个名为indexNum的属性,属性值为str let array = []; let list = [{name:'aa',age:11},{name:'bb',age:22},{name:'cc',age:33},]; list.map((item,index)=>{ array.push( ...原创 2018-09-28 11:17:19 · 19199 阅读 · 3 评论 -
vue 框架 快速搭建企业级中后台产品原型
项目地址:https://github.com/PanJiaChen/vue-element-admin-site分析:https://panjiachen.github.io/vue-element-admin-site/zh/guide/#%E5%89%8D%E5%BA%8F%E5%87%86%E5%A4%87一个后台前端解决方案,它基于vue和element-ui实现。使用了最...转载 2019-05-13 17:06:28 · 2015 阅读 · 0 评论