红噔噔-CSDN博客

原创 vue3.0使用taro-ui-vue3引入组件不生效解决方案

这两天一直研究云闪付小程序，开始和同事好不容易用云闪付的官方ui研究了，但是害怕后期在多个平台上线部署出现不兼容的问题，无奈只好另辟蹊径，选择taro来实现‘一处代码，多处运行’，我们采用Vue3.0+TS+Sass+taro-ui-vue3，在安装编译一直出现问题，掉落我们几根宝贵的头发，这里把本次遇到的坑总结下：第一步：确保已安装全局的vue3环境，在安装taro yarn global add @tarojs/cli项目初始化：使用命令创建模板项目：$ taro init myApp我这里

2021-08-31 16:18:35 4685

原创如何将blob返回值转换为json格式

今天遇到一个问题，前端通过调取后端接口下载excel，后端返回的是两种情况：（1）用户权限不足，后端返回json格式，如下图：（2）有权限，能够正常下载，后端返回二进制流，如下图：封装axios时， responseType: ‘blob’,将影响第一种情况读取reponse为blob，不能直接读取code和msg,此时就需要将blob的内容转成文件读取，不能取消responseType: ‘blob’,取消会影响正常下载调接口，根据response.data里的type去判断，返回的类型

2021-08-20 15:07:28 8531 11

原创 react+html2canvas截图转化图片下载

最近有一个新功能，用户输入顶图+中位图+底部图，然后需要用户上传缩略图，为了减少用户工作量，省略缩略图上传步骤。。。一、引用html2canvas插件（截图）（1）安装npm install html2canvas（2）引用 import html2canvas from 'html2canvas' 步骤：1.需要指定需要截图的区域，获取节点2.之后便可以拿到截图的base64url地址canvasImgFn(){ let self=this; let scrolDo

2021-12-31 18:23:05 1099

原创解决移动端手机虚拟键盘弹起遮盖输入框

移动端H5页面虚拟键盘弹起，让Input自适应上升兼容微信和钉钉：给input添加获取焦点事件：将底部的输入框整体滚动：注意：底部的输入框要用子绝对父相对 focusFn(a){ let ele=document.querySelector('.ipt_frame'); setTimeout(function(){ ele.scrollIntoView(false); document.body.scrollTop = do

2021-12-17 16:12:26 633

原创 H5页面样式兼容微信/钉钉直接打开/主流浏览器/移动端/PC端

H5页面样式兼容微信/钉钉直接打开/主流浏览器/移动端/PC端这样就可以实现PC端和移动端适配啦！1、通过vw和rem结合，动态适配屏幕，计算高度(设计图为750px)。 750px = 100vw（屏幕100vw==设计图的尺寸：750px）　　1px = 100 / 750 = 0.133333333333333vw　　100px = 0.133333333333333vw *100px = 13.33333333vw　　rem的值是根据跟根节点的字体大小来计算的，设置根节点的字体大

2021-12-10 14:39:44 2256

原创 React创建DOM节点，通过innerHtml重绘，去操作react的方法

最近做一个操作，点击新建公司，增加公司名称（可取消，保存），通过原生JS去增加节点，此时取消/保存按钮的this指向自身，不能去调用react方法，可以采用挂在在window上import ReactDOM from 'react-dom';import React, { Component } from 'react';import { Button} from 'zent';export default class station extends React.Component{ con

2021-11-03 11:16:06 1097

原创解决云闪付安装postcss-pxtorem报错

今天用云闪付中的Unionpay Vue 组件库，但是组件里面用的是px，我需要适应各种手机，做响应式，需要把ui里的px换成rem，但是下载postcss-pxtorem，出现满篇红，错误截图：大概意思就是Node Sass与当前node环境不匹配，需要重新安装nodenpm install node-sass --save然后直接yarn dev即可...

2021-08-27 15:12:19 404

原创使用ant组件中的表格，嵌套表格展开时数据污染，只展开当前行

最近遇到一个棘手的问题，Ant的嵌套表格，点击一行显示子表格的相关数据，展开其他行，共享数据源，便会使所有展开的行显示相同数据!在上网找了很多解决办法，试过都不行，Ant也没有仅展开当前行的例子，改变数据源有点复杂，所以我采取的是点击哪行就只展开该行，关闭其他行，视图上就不会影响用户体验！话不多说，直接上代码：查阅了Ant的表格API，expandedRowKeys展开的行，控制属性第一步：在表格中加上expandedRowKeys控制展开行的数据<a-table ref='saleTa

2021-08-24 13:07:08 1432 1

原创 vue使用filters做全局过滤

我们做管理系统，有很多枚举对象，显示的是字段名称，跟后端交互传参要用ID，用filters做视图过滤就方便快捷了第一步：封装一个工具函数，里面用过滤```javascriptexport const ChannelTag = (val) => { switch (val) { case 0: return '无' break case 1: return '电商' break case 2: return '

2021-08-24 10:18:45 259

原创如何用本地电脑部署一个网站

如何用本地电脑搭建一个网站？用自己的电脑运行一个网站，本机可以通过域名：端口进行访问开始部署吧选择一个html文件，里面有index.html作为入口文件开启电脑web服务打开IIS管理器如果在上图主机名需要配置本地的域名，需要在host文件中绑定在hosts文件中给127.0.0.1绑定域名ok，就可以在浏览器打开网站啦...

2021-08-11 15:16:49 4523

原创解决webpack安装了less-loader，运行报错

用webpack打包项目，安装了less-loader模块后报错原因：less-loader安装的版本过高解决方案：1、卸载之前的lessnpm uninstall less-loader2、重新安装低版本的npm install less-loader@6.0.0

2021-08-11 14:54:56 490

原创在线客服框的制作

在线客户框的制作项目场景：在线客服制作：通过在版心的右边缘设置一个悬浮框，通过过渡动画来展示制作思路：第一步：先定位整体框架，做好布局第二步：做精灵图控制每个鼠标移动的背景图效果第三步：做细节展示动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-widt

2020-12-26 15:43:38 323 2

qq_44294202的博客