- 博客(68)
- 资源 (4)
- 收藏
- 关注
原创 在vue2项目中使用dart-sass
在vue2项目中使用dart-sass。或者将node-sass换成dart-sass,原因是node-sass安装比较困难,很多时候sass-loader无法安装成功。在 Vue 2 项目中使用 dart-sass,首先需要确保你的项目支持使用预处理器。Vue CLI 3+ 默认支持 dart-sass,但如果你使用的是 Vue CLI 2,你可能需要升级项目或者手动添加支持。如果你使用的是 Vue CLI 3+,那么你可以直接在项目中使用 dart-sass。
2024-09-24 20:25:16
588
原创 vite初始化项目报错
Only file and data URLs are supported by the default ESM loader. Received protocol ‘node:‘
2023-07-13 09:46:44
1743
原创 nvm-windows 安装和使用(亲测)
nvm是一个node的版本管理工具。nvm-windows下载安装过程首先要卸载电脑上已经有的node版本,注意需要卸载干净,再安装nvm一路 next 安装就可以了。安装完成后,先试下能不能用,如果不能使用按照下面的步骤:一般直接安装完成后是不能使用的,原因是要么安装路径有空格,也可能是没有用管理员运行cmd,参考下面步骤:报错: nvm use 14.9.0 exit status 1 xxx1. 修改 C:\Users\tom\AppData\Roaming\..
2022-05-24 11:08:58
1703
原创 画一个椭圆形带扩散效果波纹展示效果
需求描述画一个椭圆形带扩散效果波纹展示效果问题解决<div class="server"> <div class="s1"></div> <div class="s2"></div> <div class="s4"></div> <div class="s4 w1"></div> <div class="s4 w2"></div>
2022-04-20 10:43:31
446
原创 如何在vue项目中使用图片路径
问题描述在img标签中如何引入图片路径如何动态修改图片地址在background属性中如何引入图片地址问题解决图片目录- src-- assets--- images在img标签中直接使用图片<img src="@/assets/image/banner.png">动态改变img标签的地址,比如轮播图:<img :src="imgList[activeIndex]">getImgList() { let arr = []
2022-04-20 10:27:39
3157
2
原创 Failed to connect to github.com port 443 after 21035 ms: Timed out
问题描述最近使用git提交代码发现总是报错,查了很多资料,比如关闭或打开vpn,取消代理服务器,取消全局代理等都无法解决问题,最后找到直接找github的IP地址修改hosts文件后成功了。使用git push 或 git clone 报错信息:fatal: unable to access 'https://github.com/xxxxx/xx.git/': OpenSSL SSL_read: Connection was reset, errno 10054fatal: unable to a
2022-04-17 22:10:08
7462
2
原创 vue自定义双向绑定的两种实现方法
问题描述在使用elementUI开发,想要对dialog进行二次封装,可以实现一个类似v-model的功能。问题分析v-model其实就是一个语法糖,它实际上做了两个动作:绑定数据 value触发输入的input事件去修改value<input type="text" :value="name" @input="name=$event.target.value">对于dialog来说value就相当于一个控制显示隐藏的Boolean值,然后在关闭弹框的时候通过$emit触发i
2022-04-12 20:37:21
2165
原创 vue-element el-table 使用sortablejs拖拽排序
需求描述vue-element-admin开发过程中需要对el-table行进行排序(即每一行可以上下移动),然后将排序后的数据传给后台更新数据。该表格无分页。问题分析方法一:可以采用在每条数据中加两个上下移动的按钮,每次移动一行。该方法实现简单,不过要连续移动的时候需要多次调用接口,交互效果不太好。方法二:可以采用table的拖拽功能实现行的一次性拖拽。该方法可以实现拖拽后调用接口,任意移动多行,但是需要依赖sortablejs仓库。问题解决综合考虑决定使用sortablejs实现该功能。
2022-04-11 16:27:19
3997
原创 echarts拓扑图给节点添加点击事件
问题描述前端使用echarts展示关系图,要求点击节点做一些操作。问题解决// 节点渲染完后调一个方法设置点击事件myChart.setOption(option)this.handleClickNode(myChart)// 设置点击事件handleClickNode(chart) { chart.off('click') // 很重要!!否则每次渲染都会增加一次点击事件 chart.on('click', function (params) { if (params.da
2022-04-07 19:42:23
1499
原创 使用nvs管理node版本
下载nvshttps://github.com/jasongin/nvs/releases// 下载 .msi 格式后直接安装即可使用 nvs# 下载 Node.js:$ nvs add 16.14.0# 运行 nvs use 去选择 Node.js 的版本$ nvs use 16.14.0PATH += ~/.nvs/node/16.14.0/x64# 使用 nvs link 添加默认的 Node.js 版本:$ nvs link 16.14.0nvs和npm命令.
2022-03-16 15:41:26
3985
原创 “30/Jan/22 09:02 AM”不是有效日期。请按下列格式输入日期:dd/MMM/yy h:mm a
问题描述在jira使用中设置日期报错:“30/Jan/22 09:02 AM”不是有效日期。请按下列格式输入日期:dd/MMM/yy h:mm a问题分析出现日期报错是因为设置了中文版本有关,中文版本要使用中文,英文版本使用英文日期。所以中文版本下正确的日期格式是:30/一月/22 09:02 上午...
2022-01-24 21:30:30
1355
1
原创 remote: Support for password authentication was removed on August 13, 2021.
问题描述有一段时间没有使用github了,今天提交代码发现无法提交,出现以下提示:remote: Support for password authentication was removed on August 13, 2021.// 你原先的密码凭证从2021年8月13日开始就不能用了,必须使用个人访问令牌(personal access token),就是把你的密码替换成token问题分析github为什么要把密码换成token我们描述了我们的动机,因为我们宣布了对 API 身份验证
2021-11-14 20:56:40
482
原创 vue页面无法正常渲染的问题
问题描述开发过程中发现有其中一台Mac测试机上的某一个页面渲染有问题,刷新页面后页面正常显示然后页面闪动一下,部分dom就消失了。问题分析测试页面发现原始页面有滚动条,到初始化页面后滚动条看不到了,头部的dom也看不到了。通过缩放视口或者鼠标移动到滚动条处可以让隐藏的dom正常显示,猜想可能由于某些原因导致页面初始化渲染异常,解决方法尝试在数据加载之后手动改变元素宽高重新渲染页面。问题解决经尝试发现在控制台手动改变元素宽度或高度都可以导致页面重新渲染。$http(url, params, (re
2021-10-12 11:28:02
1098
原创 el-select多选以tag展示,超过显示长度以...省略号显示
问题描述需求:el-select多选以tag展示时,超过显示长度以…省略号显示。注意:① 一个tag文字过长需要溢出隐藏,超出部分… 显示② 多个tag卡片溢出隐藏,超出部分…显示问题分析单行文字溢出隐藏overflow: hidden;text-overflow: ellipsis;white-space: nowrap;多行文字溢出隐藏-webkit-line-clamp // 是一个不规范的属性,它没有出现在 CSS 规范草案中。限制在一个块元素显示的文本的行数。 为了实现该
2021-09-26 10:59:49
7464
原创 vConsole在移动开发中使用
vConsole一个轻量、可拓展、针对手机网页的前端开发者调试面板。vConsole.js 重写console方法,实现了类似于微信小程序的移动端调试效果。直接引入使用<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.9.0/vconsole.min.js"></script><script> // init vConsole var vConsole = new VConsole
2021-08-20 18:45:28
285
原创 vue切换tab更新路由created执行两次
问题描述element-admin中使用tab切换到不同的路由,发现每次切换tab路由都会执行两次生命周期<tabs :tabs="tabs" v-model="activeName" @on-switch="handleSwitch"> <components :is="activeName"></components></tabs>问题分析Vue官网上提供了一个动态组件 <component :is="c
2021-08-19 20:14:54
4171
原创 el-table显示树形数据报错
问题描述el-table显示树形数据报错Error: for nested data item, row-key is requiredTypeError: this.$el.querySelectorAll is not a function问题分析后端返回的树形结构中没有返回id字段,所以需要手动遍历数据给数据添加id,el-table中默认设置row-key=“id”,没有id,又没有设置row-key的值这时就会报错。问题解决递归数据recursive(data) {
2021-06-08 20:37:37
3194
原创 vue管理系统(element-admin)在render函数中使用指令
问题描述需求:table列表中文字溢出隐藏,并且隐藏的文字要使用title提示。问题分析需要一个title提示的指令或者方法在table列表的数据中使用这个指令或方法问题解决写了一个全局指令, 如果文字溢出了就提示title,如果文字没有溢出就不显示title。// 溢出隐藏显示title Vue.directive('title', { inserted: function (el, binding) { let padding = binding.value
2021-04-21 13:34:27
1536
原创 elementui中多个table同步滚动
问题描述element-admin中同时使用多个table,要求头部固定,给每个并列的table设置max-height,通过监听一侧的table滚动情况去控制另外一侧的table滚动。问题分析table分成两部分,左侧是一个table,右侧是有去掉头部的多个table组成(动态生成),想要实现双向滚动要完成3个任务。左侧滚动控制右侧同步滚动右侧一个滚动控制右侧所有同步滚动右侧滚动控制左侧同步滚动解决问题重点:通过mouseover事件来开启/停止当前鼠标所在区域的scroll事件,因为
2021-03-22 20:03:52
2587
3
原创 /deep/在chrome89+中出现样式混乱的问题
问题描述elementui-admin项目中使用/deep/在chrome89+中出现样式混乱的问题公共样式文件中,使用/deep/,在main.js中引用,chrome89版本以下生效。chrome89+ /deep/选择器失效,导致样式错乱,覆盖的样式失效。问题分析Chrome 63将删除::shadow 和 /deep/在Chrome63之后,你将无法使用shadow-piercing 选择器, ::shadow 和 /deep/ 来设计(style) shadow root里面的内容。
2021-03-12 19:27:07
1350
1
原创 vue项目中配置eslintc.js文件
module.exports = { root: true, 'extends': [ 'plugin:vue/essential', '@vue/standard' ], rules: { // allow async-await 'generator-star-spacing': 'off', // allow debugger during development 'no-debugger': process.env.NODE_ENV =
2021-01-09 21:35:59
439
原创 vscode配置setting.json文件
{ //主题颜色 "workbench.colorTheme": "Solarized Dark", "terminal.integrated.rendererType": "dom", // "editor.fontSize": 15, //失去焦点后自动保存 // "files.autoSave": "onFocusChange", // #值设置为true时,每次保存的时候自动格式化; "editor.formatOnSave": false, //每120行就
2021-01-09 21:32:05
2980
原创 git在线升级版本
问题描述最近使用git提交代码到github发现每次都要登录,输入用户名和密码后现实登录失败,但是能提交成功,一直找不到原因,今天收到github发来的一封邮件,提示说我的git版本太低导致多次登录失败。问题解决升级git版本,直接打开git输入下面命令# 查看版本git --version# git版本是2.17.1之前的,使用:git update# git版本是2.17.1之后的,使用:git update-git-for-windows备注按照上面流程下载好后就会自动安装
2020-12-15 21:26:53
1558
原创 vue+iview项目中全局loading效果
title: vue+iview项目中全局loading效果这篇文章主要介绍了vue+iview项目中全局loading效果的配置问题。问题描述vue项目中如果出现了接口嵌套的状况,外层的接口完成后loading效果就消失了,导致页面在请求到内部接口时没有任何效果问题分析看了源码发现这个Spin组件销毁组件时延迟了500ms,所以嵌套的接口在内部接口开始调用Spin后马上就要执行销毁操作了。另一个重要的原因是请求接口封装的api的url是固定的导致queue队列中只有一条数据。解决方法在每.
2020-12-08 08:41:47
3776
2
原创 使用Chrome断点调试javascript程序
1. 问题描述:代码上线后出现问题,有一个提交按钮无法点击,原因是在提交方法中多了一条 return false 语句。那么如何通过Chrome中的控制台在source中设置断点调试实现该功能呢?submit: function() { let _this = this return false // 注意这句是测试时使用的,不小心打到了生产上 let data = Object.assgin({}, _this.searchData) $reques
2020-10-15 23:47:41
371
原创 iview日期组件取一个时间区间
问题描述:需求要求通过日期组件选择一个日期区间,返回的值类似 [2020-01-01, 2020-05-31],现在的问题是设置组件type="month"返回的数据是[2020-01-01, 2020-05-01]这个问题就变成了如何将‘2020-05-01’变化为‘2020-05-31’解决办法使用new Date(year, month, 0)的方式,可以获取该月的最后一天,注意其中的year和month是数字类型的。function getDate(dateRange) { l
2020-08-22 11:37:03
427
原创 首字母大写的几个小技巧
首字母大写js方法// 方法1 (Vue 2.x 版本中使用过该方法)function capitalize(str) { return str.charAt(0).toUpperCase() + str.slice(1) }// 方法2 -- 使用replacefunction capitalize(str) { return str.replace(/^[a-z]/g, (L) => L.toUpperCase())}// 方法3function capita.
2020-08-19 22:18:22
330
原创 vuex中modules的基本用法
这篇文章主要介绍了vuex中modules的基本用法。1. store文件结构- src- components- store -index.js -modules -app.js -bus.js2.1index.js中-手动引入modulesimport Vue from 'vue'import Vuex from 'vuex'import bus from './module/bus'import app from './modul
2020-08-01 20:45:40
8370
原创 字符串补0的一个简单方法
问题描述字符串补0是常见的需求,比如日期不足2位补0,数字精度不足补0等,需求是给一个数字和一个小数精度返回一个带有特定精度的数字字符串问题分析字符串补0操作可以考虑切割字符串操作,参考:substr() 方法问题解决先看一个日期补0的方法:function padStart(str){ return ('0' + str).substr(-2)}padStart(2) // 02padStart(10) // 10后缀补0保持精度function padEnd(val, p
2020-07-12 07:31:43
5359
原创 VS Code权威指南目录
Visual Studio Code初上市作者简介最近一本新书出版可谓令人眼前一亮,此书是VS Code首著问世 微软官方出品 从入门到精通全方位的介绍了这个轻量级的工具。作者韩骏,毕业于上海交通大学软件学院,微软开发平台事业部软件工程师。VS Code(Visual Studio Code)中文社区创始人,VS Code代码贡献者,“玩转VS Code”微信公众号及知乎专栏作者,PyCon、JSConf、.NET Conf、Microsoft Tech Summit、Google Developer
2020-07-10 21:39:44
8917
原创 vue项目中按需加载动态组件
这篇文章主要介绍了如何在vue项目中按需加载动态组件。目录结构// view下有个page1文件夹,其中包含componensts组件和page1.vue,还有map.js存放page1.vue中动态加载componensts组件的映射关系- view-- page1--- components---- com1---- com2--- page1.vue--- map.js主文件page1.vue引入组件(常规引入组件)<template> <div cla
2020-06-08 00:00:34
2170
2
potplayer1.7.17508正式版-美化版-安装版
2019-05-08
Touchpad_Elantech_Win7_64
2019-05-07
vue devtools
2019-04-25
win32-x64-64_binding.node 下载
2019-01-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人