自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 收藏
  • 关注

原创 微信小程序自定义顶部导航栏

navBarHeight: 44, // 导航栏高度,iOS默认44,Android默认48。statusBarHeight: 0, // 状态栏高度。// 判断平台调整导航栏高度。-- 导航栏 -->

2025-05-13 11:06:27 411

原创 iOS上微信小程序有的手机显示不出来

iOS6,7,8 还有xr都可能会不显示图片,要把image标签都加上这个属性。

2023-08-29 09:53:41 663 2

原创 学习taro+react从0-1完整版7/7 --- api与网络请求

5.请求数据:在src里新建一个文件夹servable/duanzi.ts,在这里请求数据。4.在store中新建一个duanzi.ts,在这个文件里导入mobx;2.创建一个新的页面,比如是duanzi,示例是一个循环列表。7.在app.tsx中注入store中的duanzi。8.在app.config.ts中进行路由配置。9.这样就可以在duanzi页面显示出来。6.在页面中调用store中的方法。1.使用网络请求数据。

2023-08-16 20:01:50 260 1

原创 学习taro+react从0-1完整版6/7 --- 使用组件库

把有需要的组件粘贴到页面上,标签在顶部引用一下就可以使用了,根据组件库的配置自行调整。使用组件,打开组件库。

2023-08-16 17:22:35 203 1

原创 学习taro+react从0-1完整版5/7 --- 实现tabBar效果

实现tabBar效果,需要在app.config.ts中写tabBar的内容。selectediconpath:tab的选中图标路径,相对于项目目录。iconpath:tab的默认图标路径,相对于项目目录。pagepath:tab对应的页面路径,相对于项目目录。下一步在app.config.ts中增加路由信息。list:一次数组,包含每个tab的配置信息。然后分别创建home和my页面,完善页面内容。tabbar:表示小程序的底部导航栏。定义内容和图片文字,在这里进行配置。text:tab的文本内容。

2023-08-16 17:15:20 479 1

原创 学习taro+react从0-1完整版4/7 --- 设计稿及尺寸单位

设计稿的宽度在config/index里面,根据这个宽高设置自己的页面内容。

2023-08-16 16:26:05 95 1

原创 学习taro+react从0-1完整版3/7 --- 路由导航

这个时候我们已经创建了一个one的文件夹了,如果没有创建就再重新创建一下。示例再one/index.tsx中跳转到index/index.tsx。直接在one/index.tsx中进行导入。首先在one.index.tsx页面中。

2023-08-16 16:19:49 145 1

原创 学习taro+react从0-1完整版2/7 --- 创建页面并且使用mobx管理状态

1.新建一个文件夹,比如是one,在文件夹中配置index.less index.tsx index.css。console.log(this.props) 就可以输出。2.在app.config.ts中配置路由。4.在app.tsx里进行导入。这样就可以实现这个小案例喽~5. 注入到具体的页面里。

2023-08-16 16:08:01 299 1

原创 学习taro+react从0-1完整版1/7 --- 创建项目

浏览器打开之后就代表成功了,这时我们要在微信开发者工具中打开,首先要安装微信开发者工具,打开百度搜索微信开发者工具在官网上根据自己电脑配置自行进行下载,下载完成之后执行。根据自身情况选择配置,以我的代码为例的配置分别是:react y less mobx。确保在你的开发环境中已经安装了 Node.js 和 npm(或者使用 yarn)。打开命令行终端,并进入你想要创建项目的目录。就会生成一个端口, 在浏览器中打开首页页面。在微信开发者工具中打开,编译成功√。

2023-08-16 15:52:54 257 1

原创 前端vue项目中使用百度地图

封装一个map.js的组件,如下所示。

2023-08-08 14:55:13 580

原创 vue上传文件

一下是上传的组件库,需要更改接口。点击当前网址进行下载。

2023-07-25 10:48:40 969

原创 获取当前的实时天气

当前地区位置的实时天气,具体代码如下。

2023-07-20 15:12:32 355 1

原创 实现最完整的分页效果,删除最后一个自动跳转到前一页的数据

这是简单的基础分页,具体来讲,当页面一共展示五页的数据,删除第五页的最后一条数据时应该自动跳转到第四页,这是需要和我们页面的数据联系到一起。1.首先是使用的组件库,首先要正确的安装引用组件,才可以在项目中使用,具体代码如下。使用的是elements里的分页的组件,也可以自己封装分页组件。这样就可以实现一个完整的分页效果!的计算: 这一行代码计算出最后一页的长度,即总数 (这可以用来检查最后一页是否完全填满了结果。条件判断: 接下来的条件判断语句使用。

2023-07-20 14:29:39 777 1

原创 在可视化图表中,一侧页面添加滑动效果

在可视化大屏中,一侧的数据太多的情况家需要添加滑动效果,以下是具体代码。使用Vue的事件监听器来实现鼠标点击滑动的效果。的滚动位置设置为之前记录的位置加上移动的距离。当鼠标按下时,记录当前鼠标位置和。这样就可以实现滚轮和鼠标同时滑动的效果!同时还想实现鼠标滑动的效果时,代码如下。设置css样式,将滑动滚轮隐藏起来。事件中计算鼠标移动的距离,并将。这样就可以实现滑动混轮效果。

2023-07-20 14:15:21 143 1

原创 vue项目中上传图片模版

内容如下,运用到了组件库elements,首先要正确安装注册。按照这样的方式和步骤就可以实现vue项目中上传图片的功能。封装之后就可以在项目中使用了,具体的使用方法如下。我起名为MultiUpload.vue。首先封装一个上传图片的功能。以上是页面部分的使用。

2023-07-19 17:06:29 168

原创 实现滑入滑出和点击常在再次点击取消同时存在的功能

实现点击按钮常在,再次点击后取消并且点击时改为选中的图片状态。在这里同时也要根据自己页面内容更改页面样式,调整css!在切换图片时会预加载,提高用户体验。以下是管理滑入滑出的代码。

2023-07-14 15:02:29 186 1

原创 图片预加载,解决下拉框切换图片的闪烁白屏

动态计算并返回对应的图片路径。这个计算属性可以在Vue实例的其他部分使用,并在需要展示图片的地方动态地显示不同的图片。对象,每个属性都存储了一个图片路径。这些路径可以在Vue实例的其他部分使用,比如在模板中动态展示图片。方法根据用户选择的选项值执行不同的操作,包括预加载图片和模拟加载完成后的操作。是Vue.js的属性绑定语法,用于动态设置图片的源路径。是Vue.js的数据属性,用于存储要展示的图片路径。方法用于预加载图片,确保图片加载完成后执行回调函数。该代码片段定义了一个包含两个属性的。

2023-07-14 14:39:02 649 1

原创 三级级联选择器,用于选择一个地区(省、市、区)

另外还可以在官方仓库里下载源码里面有多种样式的选择地区的样式,可根据实际情况进行使用!该组件用于显示一个三级级联选择器,用于选择一个地区(省、市、区)。方法用于处理distpicker组件中地区的选择。它将所选的地区值更新到。这些属性用于在distpicker组件中预选地区值。事件监听器在distpicker组件中选择地区时触发。组件被导入并在当前组件中注册为一个组件。属性的对象,该属性包含所选地区的值。这样就可以实现一个三级联动地区组件。容器,其中嵌套了另一个。

2023-07-12 13:24:05 333 1

原创 vue自适应字体大小

方法使用了简单的 比例换算 公式,通过将当前视口宽度与初始宽 度进行比较,来确定一个转换系数。然后,这个转换系数会被 用于将给定的值。例如,如果你想将 字体大小从 初始宽度下的 16 像素转换为当前视口宽 度下的字体大小,可以 调用。创建一个用于根据当前视口宽度进行字体大小换算的方法。1.首先我在untils里面新建一个fontsize.js文件夹。表示 在当前视口 的宽度(以像素为单位),而。然后在main.js中全局注册。(初始宽度,默认为1920)。变量则保存了这个值。

2023-07-11 09:50:19 2255

原创 echarts单个图表随屏幕放大或缩小自适应调整

这样,当这个屏幕大小发生变化时,会触发这个resize事件,并调用这个handleResize方法进行图表的自适应调整。然后,您可以使用window的resize事件监听器来捕获屏幕大小的变化,并在变化时触发ECharts的resize方法进行图表的自适应调整。Vue中的ECharts图表随屏幕放大或缩小自适应调整,您可以使用ECharts提供的resize方法和Vue的生命周期函数来实现。当页面放大 或者缩小时,页面中的图表不随页面变化而变化,需要刷新后才可以恢复到正常状态!

2023-07-10 11:27:50 4396 3

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除