我的React的学习记录
iimmhy
努力搬砖中...
展开
-
React中实现背景模糊,除目标元素外其他页面模糊
React中实现背景模糊,除目标元素外其他页面模糊原创 2022-12-13 17:00:51 · 495 阅读 · 0 评论 -
解决微信小程序输入框聚焦时内容被上推致布局错乱
第一张是正常的未聚焦状态,第二张是滚动后聚焦,文字跑上面去了。解决:页面使用ScrollView组件,设置overflowY:auto;minheight:100vhoverflowX:hidden自己测试了几次,如果页面不超过一页就不用做这些操作,页面如果超过一页就会出现这个BUG,可以试一下这个办法。(亲测是有效的)...原创 2022-05-19 09:38:08 · 1845 阅读 · 2 评论 -
style-components代码突然没有提示了(已解决),我还以为开发软件卡了......就挺突然的
然后搜了一下说是版本更新了,行内样式和自定义组建样式都莫得的提示,自己摸索了半天,重启好几次都没用,然后我有安装了下面这个版本的提示就出来了。安装这个插件后的效果原创 2022-01-07 10:36:39 · 1948 阅读 · 0 评论 -
上下拼接图片,高度设置100vh,内容超过可以自然滚动
style={{ backgroundImage: `url(${顶部背景图}),url(${底部背景图})`, backgroundRepeat: "no-repeat,no-repeat", backgroundPosition: "0 0, 0 100%", backgroundSize: "100%", background-color: #7517aa; width: ...原创 2021-12-02 09:44:22 · 300 阅读 · 0 评论 -
微信小程序页面刷新
我用的是最简单粗暴的方式:路由重新跳转到当前页面原创 2021-09-28 15:53:05 · 688 阅读 · 0 评论 -
react前端通过接收到的数字显示五星评分
只需要传递recommend的值0.5=》表示半星1=》表示整星0=》表示空心import React, { useMemo } from "react";import emptyStar from "./image/empty-star.svg";import halfStar from "./image/half-star.svg";import fullStar from "./image/full-star.svg";interface Props { recommend:原创 2021-08-31 10:35:04 · 456 阅读 · 0 评论 -
React实现倒计时
React实现倒计时import { View } from "@tarojs/components";import React, { useEffect, useState } from "react";interface Props { year: number; month: number; day: number; hour: number; min: number; second: number;}export const CountDown: React.F原创 2021-08-26 17:41:26 · 2267 阅读 · 0 评论 -
MacBook微信开发者工具更改代码后没有编译
找这个问题差点把自己气死,昨天还好好的,今天来改了代码之后就不行了。搜了很多解决办法,重启/清除缓存等等。最后我的解决办法是用yarn build打包编译一次,然后再用yarn watch编译。我还遇到了另外一个问题就是删除了某个页面之后,控制台还是一直打印已删除页面的错误,解决办法跟上面一样,因为我运行了yarn build之后,两个问题都没了QAQ。就这问题又浪费了我一个早上55555…...原创 2021-08-17 10:48:09 · 493 阅读 · 0 评论 -
实现右三角尖
代码 .rightTriangle{ width: 20rpx; height: 20rpx; border-right: 1rpx solid #c3c3c3; border-top: 1rpx solid #c3c3c3; transform: rotate(45deg);}<View className="rightTriangle"></View>效果图:原创 2021-08-13 14:25:02 · 99 阅读 · 0 评论 -
解决微信小程序中图片闪烁的问题
被这个问题逼出了强迫症,到处找解决办法,最后自己用了这个方法算是解决了。在全局css中加这样的代码:Image{ height: auto;}我设置的是固定宽度,高度自适应用的是widthFix,我的理解是自适应图片的高度,那么高度加载是需要一定时间计算的,这段时间可能就出现了这种闪现的问题,加了height:auto之后,他就有了一个高度,也就不会出现那种闪现的问题。最好用真机看一下方便更直观的看效果。...原创 2021-08-04 11:01:38 · 4553 阅读 · 6 评论 -
微信小程序键盘不覆盖输入框
实现微信小程序键盘不覆盖输入框,即聚焦时输入框被键盘上推而不覆盖。解决:输入框添加属性adjustPosition,主要代码:<Input adjustPosition type="text" placeholder="点击输入,向已经购买过的9990人提问" value=""/>实现效果如下:...原创 2021-08-02 10:47:23 · 1090 阅读 · 0 评论 -
在微信小程序中实现Wi-Fi功能
在微信小程序中实现Wi-Fi连接功能#1.首先通过后端提供的接口获取到ssid和passwordconst { data: wifi } = useQuery(["wifi"], async () => { const res = await phetch<{ data: { id: string; ssid: string; password: string; }; }>( `api/原创 2021-07-19 11:15:50 · 3765 阅读 · 1 评论 -
在react中简单的实现切换功能
在react中简单的实现切换功能1.设置一个变量用useState保存,是为了后面修改const [state,setState]=useState(true)这里的初始值是随便设置的,也可设置其他的,我这里就用boolean类型的吧2.HTML部分因为我是在微信小程序写的,View看作div就可以了 <View> <View style={{ backgroundColor: state ? "orange" : "#原创 2021-07-19 11:58:43 · 1043 阅读 · 0 评论 -
小程序导入时报错app.json文件不存在问题解决
小程序导入时报错app.json文件不存在导入时一定要先选择与app.json最近的父级文件选择紧挨着的上一级文件如果用的是测试号的话你会发现又有一个问题解决办法原创 2021-07-28 10:28:46 · 1033 阅读 · 0 评论