weixin_42584321的博客

react / umi 配置自定义环境变量

weixin_42584321 — Wed, 12 May 2021 16:06:53 +0800

前言：在我们开发一个项目时，有些情况需要我们根据不同环境执行不同的操作，而内置的 process.env 中的环境变量不足以满足需求时，我们就需要手动来配置自定义的环境变量了。一、react（项目环境：create-react-app 脚手架）方案一：使用 cross-env 插件（推荐）使用 cross-env 是一种比较常见的做法。由于我这里是脚手架搭建的，后面的步骤需要执行 npm run eject 把 webpack 配置暴露出来，注意项目一旦执行 npm run eject 操作后不可

antd按需加载及配置自定义antd主题

weixin_42584321 — Mon, 22 Feb 2021 18:28:25 +0800

react+antd 配置按需加载及自定义antd主题基于create-react-app脚手架开发。 react版本16.13.1；antd版本4.10.3。按需加载一、使用 babel-plugin-import 插件首先讲一下通过 babel-plugin-import 这个插件来实现的按需加载方式。安装 babel-plugin-import 插件： //npm用户 npm install babel-plugin-import //yarn用户 yarn add babel-plu

React 轮询并弹出浏览器通知（Notification）

weixin_42584321 — Wed, 05 Aug 2020 18:17:11 +0800

React 轮询并弹出浏览器通知（Notification） Notification是H5新增属性，目前应该是除IE外其他浏览器都兼容点我可以看Notification的完整api 需求是进入页面后开始轮询，然后符合条件的话弹出浏览器通知框一、轮询我这里直接使用setTnterval进行轮询，首先在state中定义一个变量（将setInterval赋值给一个变量的意义在于需要用这个变量在页面销毁、卸载的时候清除掉，清除setInterval的重要性远高于清除setTimeout），例如timer:n

微信小程序使用.wxs在.wxml中分割字符串渲染多条数据

weixin_42584321 — Mon, 13 Apr 2020 15:13:26 +0800

在开发微信小程序的项目中，由于接口中有一个字段的值以符号作为分隔，存放了多个value需要在前端展示（例如下图中的good_field字段）。需求效果图首先这是一个循环渲染出来列表，我无法在这整个循环中再去循环另一个数组渲染（主要是我不知道这样怎么写哈哈哈），所以我才用wxs模块来给整个列表中的数据中每一条数据单独循环渲染。上代码 wxs： // magic.wxs var split =...

腾讯云实时音视频小程序端双人通话功能使用

weixin_42584321 — Tue, 07 Apr 2020 18:09:57 +0800

关于腾讯云实时音视频TRTC双人通话功能小程序端使用记录由于疫情发生，互联网界急需各种线上功能，例如网课，线上视频面试等。我所在的公司也接到了新的需求，需要在小程序端利用腾讯云实时音视频服务实现线上双人通话功能（后期可能还会继续做多人语音会议及多人视频会议功能，实现方式大同小异），这篇文章主要记录一下微信小程序端双人视频通话实现的过程。一、体验并下载DEMO 首先我们先从腾讯云小程序端的DEM...

记录react+antd项目中使用Popconfirm及获取所点击行的数据

weixin_42584321 — Sun, 19 Jan 2020 18:17:47 +0800

记录react+antd项目中关于Table中使用Button实现点击某行禁用效果及Popconfirm踩坑一、首先使用点击Button弹出Popconfirm，再点击确定来控制disabled属性的true或者false，控制disabled属性通过控制一个变量就可以了。 1.首先看一下Popconfirm及Button的使用