自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(153)
  • 问答 (1)
  • 收藏
  • 关注

原创 ant-design-vue 中 table行 点击事件

在使用 AntDesign 过程中,需求单击表格选中。设置table的customRow属性。设置之后,虽说官方文档也有详细介绍如何实现该功能。但是没看太懂,百度后解决。

2024-07-30 15:22:23 636

原创 uni-forms 如何校验 select (uni-data-select)

其实校验规则一点也没变,只是第一次进入要把 select 绑定的值改为null// 校验表单数据},// 校验规则rules: {rules: [{errorMessage: '请选择文件类型'}]},value: 1,text: "原件"},value: 2,text: "复印件"},value: 3,text: "其他"],仅供参考。

2024-05-16 09:56:48 334

原创 写一个只允许输入身份证号的正则表达式

没有做校验 X 只能输入在最后一位,请大神知道,本人正则很水。只允许输入数字和大写字母A-Z。身份证号中存在带X的情况。

2023-06-09 09:10:31 381

转载 纯JS前端分页方法(JS分页)

如后台传回的数据条数非常多,达到几千条甚至上万条,但是后台又不方便分页传回数据,这个时候就只能前端先获取所有数据保存下来,然后前端本地进行分页并渲染显示。1、JS分页函数:开发过程中,分页功能一般是后台提供接口,前端只要传page(当前页码)和pageSize(每页最大显示条数)及对应的其他查询条件,就可以返回所需分页显示的数据。原创博客禁止抄袭,原文地址:https://www.cnblogs.com/xiao-pengyou/只需要传入对应参数就可以返回带有对应分页属性的对象,用于前端界面展示。

2023-05-15 14:44:55 2786 1

原创 iOS APP中,长按复制,剪切的提示改为中文

2. 如下图,在info中添加 Localized resources can be mixed,并把值改为 YES。在另一个博主的原文中进行到这一步就结束了,但是亲测无效,我多加了下一步。写在前面:借鉴了两位大佬的文章进行结合,得到了我想要的结果。1. 将项目用xcode打开,如下图。

2023-05-11 16:56:04 730

原创 Vue实现实现一个带底部标识的横向滚动导航栏

此文章参考了 csdn 中另外两位大佬的文章,在他们的基础上又加上自己的写法。地址1: 这个是 uniapp 实现的uniapp: 实现一个优美的带底部标识的横向滚动导航栏_uniapp横向滚动导航条_CC#的博客-CSDN博客仿淘宝菜单栏左右滑动(VUE 移动端)_计算菜单分类滚动距离_浅暖呀丶的博客-CSDN博客。

2023-04-24 09:52:08 1532

原创 记录一下 overflow-x 出现无法超出宽度出现滚动条的问题

对比了一下之前写的,好像是 设置了 overflow-x 的盒子内的 子级不能固定 宽度,写了好多次,今天去写又卡住了,咋写不生效,心想不科学啊也不是第一次用。我用的 width 不生效,改成 min-width 完美解决。

2023-04-23 13:55:29 520

原创 vite 更改 dist 存放的路径

vue项目执行 npm run build 后会生成一个 dist 文件夹,这个文件夹默认存放在项目最外层目录,项目下 vite.config.js,记录一下更改存放位置的方法。

2023-02-14 15:49:56 3116

原创 css定位时使用transform: translateX(-50%)水平居中

用于一个没有父级的元素 ,定位后水平居中,上代码、简单记录一下,每次用都会忘记。

2023-02-14 09:44:58 762

原创 vantUI4.0中datePicker渲染不出来报错values.map is not a function

最近在使用vantUI适配vue3的4.0版本时,日期组件老是渲染不出来,报这个错,意思是绑定值格式不对,但是我绑定的是按照官方文档的数组形式,代码如下。解决方法:van-field 的v-model和日期选择器的v-model不要用同一个。到这里依旧报错,折磨了我一天,后面突然发现,我在上面的input输入框中也绑定了。(这里我的写法依然是vue2,这不重要)导致直接把格式给我改了。

2023-02-03 17:17:48 1682 2

原创 去除el-select默认边框和 选中时的蓝色边框

【代码】去除el-select默认边框和 选中时的蓝色边框。

2022-10-27 16:43:50 4548

原创 vue3中使用 v-viewer 插件报错未定义的属性: Cannot set properties of undefined (setting ‘$viewer),和基本使用。

在网上搜了很久也没解决这个问题,在vue2中是不会报错的,后面查看官方文档和百度了几个小时以后,终于解决了,(我个人解决了,版本原因)。因为是 vue3,所以不能直接使用 Vue.use。1.先在main.js 引入。接着安装 viewerjs。

2022-10-08 16:23:05 4116 15

原创 小程序中自定义行内左滑按钮,类似于qq和wx消息界面那种

平常在使用QQ或者WX聊天,在消息列表中某一项左滑,会出现几个操作按钮,什么置顶啊,标记未读等等,下面用原生小程序实现一下这个功能

2022-07-04 11:33:43 530

原创 微信小程序中,从一个页面跳转到另一个页面后,在返回后发现页面同步滚动了

最近项目中有一个bug,在一个组件中引入了另一个组件,假设这两个组件名称分别为 A 和 B我在A页面的顶部点击跳转到B页面,在B页面滚动到底部,选取了一个值自动返回A(或者点击顶部返回键返回到A),这时候会发现A也滚动到了最底部。在这里多提一句,一般正常的返回键是小程序自带的,正常返回也不会有这个问题,仅供参考!...

2022-06-27 14:28:24 841

原创 在 uniapp 中使用 阿里巴巴矢量图标

最近要求,使用一下阿里巴巴矢量图标来替换掉项目中的某些小图片。一方面 矢量图不会失真,另一方面占用空间小了,所以去网上百度了一下,最后实现了效果,在这里分享一下我的使用过程1.到官网,登录,没有账号的话就注册一个:iconfont-阿里巴巴矢量图标库2.搜索自己想要的图标,并加入购物车中3. 点击右上角 购物车 图标,打开购物车4.点击下载代码,把下载下来的文件解压出来5. 目前我下载的,解压出来以后,文件都是默认存放在font_i5lcy3k..

2022-04-11 18:31:22 4007

原创 运行 cmd 命令报错operation not permitted, mkdir D:\nodejs\node_cache\_cacache\tmp, Error: EPERM: opera

今天在初次下载好 node.js 配置好之后,使用cmd安装 vue Cli 脚手架时一直在报错,说是权限不够,在百度找了很久,后面确实在 c盘下使用管理员身份运行可以解决,但是太麻烦了,下面说一下我个人的解决方法1.找到node.js的文件夹所在位置,右击文件夹选择属性2.点击 安全, 选择 user 点击 编辑3. 在下面的权限中,勾选 完全控制,点击确定...

2022-04-11 15:27:50 3711 1

转载 使用vuecli工程开发-组件,安装vuecli脚手架构建工具(vuecli脚手架的全局安装)

安装vuecli脚手架构建工具一、 node安装(1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v (检查一下 版本);(2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , node 安装地址:http://nodejs.cn/download/注 :安装 vue-cli 脚手架目前需要node版本为 v4.0 以上;(3)查看npm 版本(4)查看cnpm版本如果没有cnpm,我们需要使用淘宝镜像,进行安装.

2022-04-11 15:10:52 271

原创 小程序的 position: sticky; 吸顶效果的使用方法

今天在使用 uniapp 编写小程序时需要使用到吸顶效果,设置如下:.head { position: sticky; top: 88rpx; z-index: 100;}在网页上的显示效果是刚好固定在顶部显示,但是在微信开发者工具上,就距离顶部有了间隙后面发现在小程序中,需要设置: top: 0;.head { position: sticky; top: 0; z-index: 100;}注意事项:(1)距离顶部的吸顶距离 top:0 时才会生效;(2

2022-03-30 09:24:31 3089 1

原创 elementUI中 el-Switch 在 el-table-column 中点击无效的问题

在写项目时发现,就算绑定了 v-model ,switch开关也是不会生效,下面这个方法可以解决<el-table-column> <!-- slot-scope="scope" 用来解决不生效的问题 --><!-- scope.row.show 这里的 row 指的是 table绑定的data的数据 --> <template slot-scope="scope"> <el-swit

2022-03-24 17:42:04 4341 1

原创 element UI checkbox,通过后台传来的数据默认选中

今天写项目时碰到的一个问题,因为后台传来的是字符串,如果使用 checked 属性所需要的值为布尔值,应该也有办法解决,但我没找到,后面通过 v-model绑定后台拿到的数据,来完成的这一点小功能第一步:<el-checkbox-group>标签上v-model="role.permission"。这里role.permission 为后台拿到的数据,如图: <el-checkbox-group v-model="role.permissio

2022-03-22 11:36:09 7267 2

原创 关于今天在写 flex 布局,遇到 for 循环后的失效问题

最开始我的 for 循环 和 flex 布局 写在 同一层,就出现了我想让他横着排列,结果却不生效 <view class="size" v-for="(item,index) in mianliao" > <view class="size-content u-m-t-16"> <image :src="item.img" mode=""></image> <text class="u-fo

2022-03-03 15:27:34 479 3

原创 使用uView插件中From表单中的选择地区使用方法

HTML:<u-form :model="form" ref="uForm"> <u-form-item label="所在地区" label-width="125upx" class="u-p-l-30 u-p-r-30"> <u-input v-model="form.region" class="u-m-l-40" type="select" placeholder="请选择地区" @click="pickerShow = true"></u-..

2022-03-01 14:41:41 1465

原创 使用uView插件中From表单中的性别下拉框使用方法

1:找到from 表单插件,在视图层输入<u-form :model="form" ref="uForm"> <u-form-item label="性别"><u-input v-model="form.sex" type="select" /></u-form-item></u-form>2:在对应的data数据中心,输入需要的数据 form: { name...

2022-03-01 14:40:27 6859 2

原创 uniapp使用uni.navigateTo({})无法跳转到tabBar的页面的问题

使用uni.navigateTo({}) 正确指定路径时无法进行跳转到tabBar的页面,这种情况下需要使用uni.switchTab({}) 进行跳转代码如下: goZhuye(){ uni.switchTab({ url: '/pages/index/index' }) },

2022-03-01 14:37:38 1830

原创 HBuilder运行uniapp项目到小程序时,第一次设置路径报错问题

第一次使用HBuilder运行uniapp到小程序时会提示让设置小程序路径,我设置了路径之后,下面会出现这样的报错:这种情况怎么解决呢?1.打开微信开发者工具,找到左上角的菜单栏中的 设置2.点击设置中的安全设置3.打开服务端口...

2022-02-23 14:28:17 1261

原创 手机端自适应代码

(function(doc, win) { var docEl = doc.documentElement, resizeEvt = "orientationchange" in window ? "orientationchange" : "resize", recalc = function() { var clientWidth = docEl.clientWidth; if (!clientWidth) return; docEl.style.

2022-02-18 17:05:49 756

原创 小程序框架介绍、生命周期、尺寸

1.1 小程序框架组成介绍1.1.1 新建页面新建页面的步骤: 在pages目录上,单击右键选择“新建文件夹”,例如:创建cart文件夹 在cart文件夹上,右键选择“新建page”生成页面的框架(由四个文件构成) 在app.json文件中的对应目录,会自动生成放置在pages 字段中。你只需要手动的调整某些页面显示的先后顺序。如果不需要调整。默认即可。 2.1.2 设置页面顶部在app.json文件中的windows字段中设置: "window": {

2022-02-18 09:18:12 518

原创 常用资源网址

vantUIhttps://youzan.github.io/vant/#/zh-CN/contribution

2022-02-18 09:01:26 393

原创 微信小程序使用 列表渲染指令写 99 乘法表

<view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="i" class="container"> <view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item='j'> <view wx:if="{{j<=i}}"> {{j}}*{{i}} = {{(i)*j}} </view> </v.

2022-02-17 16:29:36 810

原创 在项目中使用 echarts

1.先在项目中下载 echartscnpm i echarts --save2.在 main.js 中 引入 并使用//引用 echartsimport * as echarts from 'echarts';//使用echartsVue.prototype.$echarts = echarts;3.在视图层留下放置可视化图表的盒子,起id名(注意,这个盒子必须有高度)<div class="charts_box" id="myChart"></div>

2022-02-16 11:25:45 869 2

原创 js数组去重

1. 利用for嵌套for,然后splice去重(ES5中最常用)let arr = [1,2,2,2,3,3,4,undefined,undefined,{},{},NaN,NaN,null,null,null] for(var i = 0; i<arr.length; i++){ // 让内层循环 j 在 i 后面一个位置 for(var j = i+1; j<arr.length; j++){ if(arr[i]==a

2022-01-06 10:36:26 205

原创 js 冒泡排序算法

<script> // 首先准备一个要排序的数组 let arr = [21,34,2,4,55,98,3]; // 创建一个函数,参数为我们要排序的数组 function maopao(arr){ // 声明一个变量作为临时存储数据的地方,用来等会坐变量的对调 let temp; // 数组的长度减一,是因为不需要遍历最后一个数 .

2022-01-06 09:44:13 366

原创 解决头部使用 position:fixed; 固定定位后遮住下方内容的问题

今天在做一个页面的时候,有一个效果是要让头部固定,但是在给了position:fixed; 后,继续往下写会发现下方内容有部分被头部遮住了,有两个办法可以解决这种问题1.在头部下面给一个空的 div给这个div设置高度,把页面撑开,这种方法是让头部刚好遮住的是这个空div,把内容放出来。但是这种方法需要一点点调试高度,所以不推荐。2.把整个要使用 position:fixed; 的盒子,用另一个盒子包起来比如说我有一个头部区域,需要固定 <div class="head"&g

2021-12-30 09:45:00 14993 5

原创 Vue项目中使用懒加载 vue-lazy

1.首先准备好需要的图片,放在:src\common\image目录下default.jpgdefault.png懒加载使用的图片的目的:当你页面中的素材图片没有显示出来的时候,先让懒加载的图片显示出来。2.在你的Vue项目中下载vue-lazyloadcnpm install vue-lazyload --save-dev然后,到你的配置文件package.json中查看是否下载成功。 "vue-lazyload": "^1.3.3",3.在入口文件 main.js 中

2021-12-29 17:38:42 2746

原创 通过webpack构建vue初始化项目

1.安装node,这个是肯定要安装的2.安装vue脚手架构建工具,命令行输入npm install –g @ vue/cli3.安装webpack通过 npm 或者 cnpm安装webpack模块化打包工具npm install webpack –g或cnpm install webpack –g4.初始化 webpack 项目,执行命令:vue init webpack 123app其中 123app 是我们要建立的项目的名称,当脚本执行时会进行确认安装..

2021-12-27 09:00:00 844

原创 Vuecli搭建项目,实现正在进行todolisit操作

vuecli搭建vue项目,实现正在进行todolist的操作1.找到 src 文件夹下的 views 文件夹,在里面新建一个文件 myinput.vue2.在数据中心

2021-12-25 14:00:00 242

原创 Vuex 中的 actions 与 Axios

Vuex的五大核心概念之一action,可以操作任意的异步操作,类似于mutations,但是是替代mutations来进行异步操作。actions异步其实和mutations是类似的,区别在于mutations是同步操作而且可以直接修改状态,而actions支持异步操作,但是不可以直接修改状态,所以actions提交的是mutations。这里接着上一篇文章,通过php模拟一段JSON数据,使用数据仓库中的 actions 拿取数据1.首先先把页面中state内的goods删除成一个空数组,然

2021-12-24 14:00:00 1172

原创 Vuex的基本概念,和Vuex中的 state,getters,mutations

1.基本概念Vuex 是一个专为 Vue.js 应用程序开发的(数据的)状态管理模式。Vuex采用“集中式存储管理”方式去管理数据,把 这些数据 应用到 所有组件上 !!!vuex就是仓库---数据仓库--这个数据仓库里的所有的数据,是为组件来使用的!为组件来服务的!vuex 只 做 “数据” 的维护!!对vuex仓库中数据的处理,我们都放在“模型”里面。在vuex这个仓库 store 里面。2.vuex核心概念state 存储数据getters 获取数据的方式...

2021-12-21 20:26:07 687

原创 vue create~~初始化项目

在创建初始化项目之前,我们需要新建一个文件夹,用来存放项目,假如起名就叫做vue-project,打开这个文件夹,在物理路径位置输入cmd,打开终端vue create~~初始化项目执行命令:vue create hxx (注意:后面名称属于自定义名称)键盘上下键选择,选择自己需要的特性(上下键移动键,空格键是否选中,a键切换选择所有,i键反转选择选项)( ) Babel //( ) Babel //支持高阶语法转换( )...

2021-12-20 10:36:36 588

原创 基于webpack构建的vue项目的目录结构

vue项目结构下面的目录结构是基于webpack构建的vue项目的目录结构

2021-12-17 16:34:14 338

空空如也

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

TA关注的人

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