- 博客(170)
- 收藏
- 关注
RSS订阅原创 vite项目启动失败, 报错信息: Error: spawn undefined\System32\WindowsPowerShell\v1.0\powershell ENOENT
vite项目启动失败, 报错信息: Error: spawn undefined\System32\WindowsPowerShell\v1.0\powershell ENOENT
2025-02-17 11:39:22
304
原创 uniapp微信小程序任意图片铺满, 超出下滑
img标签属性mode=“widthFix”。widthFix/heightFix 模式会在图片加载完成后，动态改变图片的高度或宽度。图片高度或宽度的动态改变。scroll-view: 可滚动视图区域。使用竖向滚动时，需要给scroll-view一个固定高度。这里设置了100vh视口高度。
2024-12-06 09:33:16
1196
原创 element表单disabled功能失效问题
场景:当需要根据商品状态来判断是否开启disabled来禁用表单时, disabled绑定了对应的值, 但无论商品是哪种状态, 表单都能操作, disabled失效。原因: 虽然disabled绑定的对象是动态获取的, 但没有声明默认值会造成绑定失效。解决: 在form对象里加入saleFlag的默认值。
2024-07-22 11:28:18
899
原创 vue3框架腾讯地图v1版项目-MultiMarker点标记自定义样式和图片的写法
腾讯地图v1版 MultiMarker点标记功能中的样式应用, 更换点标记的图片等方法
2024-06-06 15:03:41
1757
原创 vue项目门店官网页面, 根据视口大小自动跳转页面逻辑(pc --＞ mobile / mobile --＞pc)
在app.html文件添加以下代码逻辑。mobile -->pc逻辑与上面相似。
2023-11-27 10:50:08
293
原创 html- a标签包裹img标签, 点击图片无法跳转问题记录及解决方法
这里的解决方式通过把a标签跟img标签的结构改成同级, 然后样式中对a标签添加绝对定位, 并且保证a标签的z-index为当前最高层级。首先明确我们的目标, 就是a标签包裹的内容, 都能点击后以后直接跳转。
2023-10-24 17:39:20
1650
原创 el-form表单动态校验(场景: 输入框根据单选项来动态校验表单 没有选中的选项就不用校验)
关键点: 跟正常校验流程不同的是, el-form-item标签内的required和rules都要加上判断条件。场景: 输入框根据单选项来动态校验表单。没有选中的选项就不用校验。正题部分-表单动态校验。
2023-09-07 14:17:35
2983
原创 el-date-picker回显问题解决记录
偶然性解决问题, 还存在很多疑点, 由于项目比较赶, 已解决问题为目的做个记录, 以后回来筛查原因。回显事件赋值时无法回显, 数据都能拿到但是视图没有变化, 实际显示的是空时间。
2023-08-02 14:39:22
2350
原创 vue2 element el-date-picker报错TypeError: e.getHours is not a function
错误出现场景:1.编辑回显数据时2.时间组件由v-if控制并且为隐藏状态时3.时间组件v-model接受接口返回的数据为null时4.这时候时间组件v-if为true展示时就出现了标题报错。
2023-06-26 14:39:38
1542
原创 vue3中在箭头函数和普通函数中使用async awit调用接口
方法二: 在普通函数中使用async awit。方法一:在箭头函数中使用async awit。
2023-06-13 16:06:33
2061
原创 element-plus的messageBox样式丢失，main.js重新引入el样式后设置的主题色失效
main.js重新引入element样式，本人项目使用自动按需引入的方法使用element+ui，并结合使用scss。引入后发现定制的主题色被新引入的样式覆盖了,下面修改了引入的文件, 完美解决。
2023-05-23 16:06:02
824
1
原创 vue3切换页面路由再返回swiper失效
问题描述：在vue3项目使用swiper插件时，进入页面swiper轮播图能正常运行，但是在切换了页面再返回有轮播的页面，轮播图就停留在第一张， 并且轮播进度指示点只有一个
2023-04-04 16:22:08
495
原创 vue2项目-request配置put请求Content-Type为x-www-form-urlencoded
当发起put请求时, headers里的Content-Type的值需要改为application/x-www-form-urlencoded
2023-03-14 11:24:18
3276
原创 vant ui progress进度条组件样式调整
组件api: pivot-text- 进度文字内容 string 百分比。区分效果一没有用flex布局, 用了定位样式。这里把pivot-text的值设置为空。效果二是文字在进度条内部。
2023-02-01 10:14:59
3223
原创 vue2-vant组件库-van-search获取焦点方法
注意: 直接通过this.$refs.name.focus是不能获取到input的dom元素, 需要通过querySelector()方法查找到input元素,2.在进入页面时或点击历史记录时, 输入框input触发获取焦点事件–focus。1.通过在van-search组件标签通过ref获取输入框的dom元素。1.进入搜索页时, 搜索输入框自动获取焦点;2.点击历史记录, 搜索输入框自动获取焦点。2.进入页面时获取焦点。点击历史记录时获取焦点。
2022-12-27 14:34:19
5153
原创 el-date-picker时间组件封装 需求 开始的时间都是00：00：00 结束的时间是23：59：59 后端需要传递的两个参数 开始时间和结束时间
el-date-picker时间组件封装 需求 开始的时间都是00：00：00 结束的时间是23：59：59 后端需要传递的两个参数 开始时间和结束时间
2022-09-14 18:39:30
2146
4
原创 element-ui 切换分页条数，触发两次请求-bug记录, 分页组件封装
total不要与page-size 混淆，在没有指定current-page的情况下组件自动依据total(数据总条目数)进行分页(前提得指定page-size并且指定数量不能大于total)，如果混淆会导致没有进行分页或者数据总条目数不准确。对当前页数据显示个数进行配置（以数组形式进行配置，例：[10, 20, 30, 40]）page-size，文档所指为每页显示条目个数，支持 .sync 修饰符；total，文档所指为总条目数，显示接口返回的数据总条目数。1.先手动计算要跳转的最大页数。
2022-09-11 23:36:21
2325
原创 js-includes()方法
includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false。在查找数组对象的时候, 要通过JSON.stringify()方法相对要查找的数组进行转换。includes()方法很强大，字符串，数组，对象均可使用，返回一个布尔值,“一” ‘[{“a”:1}]’
2022-09-07 13:59:16
3477
原创 elementui- Select 选择器-案例: 在v-for循环的多个下拉列表选择后需要传递对应的名字和id
场景 多个下拉框由v-for循环得到, 下拉框选项也是通过循环得到。用了find的方法进行绑定对应的名字。
2022-09-05 20:05:23
2517
1
原创 element-ui日期选择器el-date-picker, 案例:填写有效期和选择开始时间后, 自动生成结束时间, datetime时间转换
两种场景(1.先输入有效期后选择开始时间;2.先选择开始时间, 后输入有效期)都能触发自动生成结束时间的逻辑。以下代码可能偏长, 建议一步一步console.log打印出来每一步的效果, 避免出现数据没拿到或者方法用错的情况。
2022-09-05 18:55:00
2891
2
原创 Element-UI关于弹窗表单提交时表单数据丢失的问题记录
问题记录:Element-UI关于弹窗表单提交时表单数据丢失出错原因:在el-dialog标签绑定了属性 解决方法改成
2022-06-14 10:24:01
1030
2
原创 vue基础-侦听器watch
侦听器watch1.作用侦听data/计算属性中声明的变量的值的变化2.语法watch: { 被侦听的属性名(newVal, oldVal)){ newVal: 表示修改后的值 oldVal: 表示修改前的值 } }<template> <div> // 注意: watch是和计算属性computed同级的 <input type="text" v-model="name" />
2022-05-26 21:55:17
208
原创 vue基础-computed计算属性
computed计算属性1. 计算属性用途例如购物车, 总价是依赖商品价格算出来的当你需要依赖一些变量计算出来结果的时候, 就可以使用计算属性注: 计算属性不能和data里的数据重名2. 代码示例<template> <div> <p>商品1: <input type="number" v-model.number="product1" /></p> <p>商品2: <input type="n
2022-05-26 21:36:14
366
原创 vue基础-filter过滤器
filter过滤器1. 作用转换格式, 把变量或者表达式转换出来 -2. 语法:{{ 表达式 | 方法名 }}3. 代码示例<template> <div> <h1>价格: {{ price }}</h1> <h1>{{ price | rmb }}</h1> <h1>{{ price | dollar }}</h1> <h1>{{ price | o
2022-05-26 21:26:45
140
原创 vue基础-动态设置样式class和style
动态设置样式class和style一. :class语法:class="{类名: 布尔值, 类名2: 布尔值}"作用: 动态设置class代码示例<template> <div> <button :class="{ grey: isOn === true, white: isOn === false }" @click="isOn = !isOn" > 开关 &l
2022-05-26 21:19:30
682
原创 vue基础-实现控制元素显示隐藏 v-show与v-if,以及v-if-else
v-show与v-if作用一.v-show控制元素显示, 通过display: none控制显示语法: v-show=“变量或者表达式”如果变量或者表达式为true, 会显示标签, 否则隐藏二. v-ifv-if控制标签显示语法: v-if=“变量或者表达式”v-if通过控制标签是否删除显示 , v-if有性能优势三. 代码示例<template> <div> <h1 v-show="age >= 18">年满18岁才能看到以下内容&
2022-05-26 21:03:07
4043
原创 vue基础v-moder修饰符( number, trim, lazy )
v-moder修饰符一. v-model修饰符语法法: v-model.修饰符="变量"二.这里只列举v-model修饰符在表单中的作用number修饰符: 把数据转换为数字类型并赋值给变量trim修饰符: 去掉字符串首尾空格lazy修饰符: 等表单失去焦点, 才把值赋予给Vue数据变量三. 代码示例<template> <div> <p>年龄: <input type="number" v-model.number="age" /
2022-05-26 20:49:16
1354
原创 vue基础-v-on的修饰符
v-on的修饰符一. 事件修饰符的语法:@事件名.修饰符="..."注: @是v-on的简写形式二.prevent修饰符作用: 阻止事件默认行为代码示例:<a href="https://www.baidu.com" @click.prevent="done">去百度</a>这里绑定了点击事件, 点击事件默认行为就是点击交互, 所以这里的按钮为禁用状态三. stop修饰符作用阻止事件冒泡代码示例:<template> <
2022-05-26 20:14:34
589
原创 vuex基础
vuex介绍作用方便组件通信, 状态管理模式(管理共享数据用的)Vuex是采用集中式管理组件依赖的共享数据的一个工具， 可以解决不同组件数据共享的问题项目当中引入 vuex下载包 npm i vuex@3根据vue版本下载对应版本的vuex, 最新版的vuex仅支持vue3配置项目 main.jsimport Vue from 'vue'import App from './App.vue'Vue.config.productionTip = false// 引入 v
2022-05-24 20:35:25
179
原创 vue侦听器watch
vue侦听器watch一. 侦听器watch的用途可以侦听data/computed属性值改变侦听一个属性变化基本语法:watch:{ "被侦听的属性名"(newVal, oldVal){ } }二.侦听器完整例子<template> <div> <input type="text" v-model="name"> </div></template><script>export defa
2022-05-23 19:49:45
248
原创 vue计算属性computed
vue计算属性computed一. 计算属性computed用途和语法例如购物车，当你需要根据一些变量计算出来结果的时候语法: computed: { "计算属性名" () { return "值" } }注意:依赖的变量变化的时候会重新计算计算属性不能和data里的数据重名二. 计算属性computed示例<template> <div> <p>{{ num }}</p&g
2022-05-23 19:44:28
181
原创 Vue过滤器属性filter
vue属性过滤器filter一. 过滤器filter作用作用是转换格式, 把变量或者表达式转换出来Vue中的过滤器场景全局定义字母都大写的过滤器字母转大写, 输入"hello", 输出"HELLO"局部定义字符串翻转的过滤器字符串翻转, “输入hello, world”, 输出"dlrow ,olleh"二. 过滤器filter语法:全局注册的语法:Vue.filter(“过滤器名”, (值) => {return “返回处理后的值”})局部注册的语法:
2022-05-23 19:38:22
1116
原创 Vue组件和组件通信
Vue组件和组件通信一.Vue组件概念, 创建注册使用; 封装组件概念 :组件是可复用的 Vue 实例, 封装标签, 样式和JS代码 — 一个vue文件就是一个组件组件化 ：封装的思想，把页面上 可重用的部分 封装为 组件，从而方便项目的开发和维护一个页面，可以拆分成一个个组件，一个组件就是一个整体, 每个组件可以有自己独立, 互不影响口诀: 哪部分标签复用, 就把哪部分封装到组件内组件内template只能有一个根标签组件内data必须是一个函数, 独立作用域
2022-05-17 19:10:00
442
原创 js[面试题]箭头函数和普通的区别
箭头函数与普通函数的区别1、外形不同：箭头函数使用箭头定义，普通函数中没有。2、箭头函数全都是匿名函数：普通函数可以有匿名函数，也可以有具名函数3、箭头函数不能用于构造函数：普通函数可以用于构造函数，以此创建对象实例。4、箭头函数中 this 的指向不同： 在箭头函数中不会创建自己的this，只会从自己的作用域链的上一层继承this。（注意其中对象不构成作用域） 在普通函数中，this 总是指向调用它的对象，如果用作构造函数，它指向创建的对象实例。5、箭头函数不具有 arguments 对象：
2022-05-15 19:14:34
1602
原创 vue通过设置代理解决跨域(适合初学vue测试学习阶段使用)
vue通过设置代理解决跨域此方式适合适合初学vue测试学习阶段使用, 使用的是vue2的版本步骤1通过vue脚手架创建好项目, 没有脚手架请先行安装vue脚手架.创建vue项目命令vue create 项目名// 规范命名, 小写字母开头这里使用的是vue2的版本步骤二打开项目根目录创建vue.config.js文件里面配置代码module.exports = { devServer: { // 设置代理 port: 3009, // 自定义端口号 o
2022-05-11 10:44:15
320
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人