- 博客(56)
- 收藏
- 关注
RSS订阅原创 Vue3：Axios配置及使用
在package-lock.json文件可以查看axios版本milliaAxios.js 配置axiosapi.js 接口基地址及接口路径api.js里的基地址和代理接口 需同vue.config.js的配置一致，即。
2024-01-09 10:18:57
1173
原创 Vue3：vue-cli项目创建及vue.config.js配置
是JavaScript的超集（.ts文件），包含并扩展了 JavaScript 的语法。项目创建Vue 2.x、Vue 3.x 或自定义，默认版本vue3.x和vue2.x无需配置，自定义需配置。通过 ↑↓ 箭头选择依赖，按 “空格” 是否选中，按 “a” 全选，按 “i” 反选。自定义选择需要支持的特性 （ ↓ 不使用任何css或js扩展）vuex（vue的状态管理模式、store）CSS 预处理器（如：less、sass）代码风格检查和格式化（如：ESlint）vue-router（vue路由）
2024-01-08 10:36:34
1945
原创 时间与时间戳转换比较及android和ios对时间识别的区别
需要将对象格式化为："2021/05/01 12:53:59.55" 可同时兼容 android 和 ios。"2021-05-01 12:53:59.55" 时间对象在 ios 中会出现 NaN-NaN-NaN。yyyy/mm/dd hh:mm:ss 比较 yyyy/mm/dd hh:mm:ss。年/月/日 时:分:秒 与 年/月/日 时:分:秒。yyyy/mm/dd 比较 yyyy/mm/dd。年/月/日 与 年/月/日。时间比较要注意两个时间的。时间戳转换为时间对象。时间戳转换为时间对象。
2023-12-23 18:07:49
820
原创 Vue3：解决基地址不同 数据交互http与https跨域问题
配置公共管理的api文件和vue.config.js可以解决跨域问题。一个项目对接不同的基地址和接口同理。去除api和vue.config.js里 http: 和 https: 不会报跨域但是有。不修改api和vue.config.js，在index.html的head中中添加。基地址对应不同的http协议（http和https），线上项目会报跨域。
2023-11-06 09:52:38
1092
原创 Vue3：一页多题答案提示及循环radio和checkbox混合使用
一页多题，类型包括单选，判断多选，涉及radio和checkbox同时使用，数据提交。
2023-11-05 12:29:23
374
原创 文件上传input type=“file“之accept接受的类型汇总
规定了用户可以在其中输入数据的输入字段。 元素在 元素中使用，用来声明允许用户输入数据的 input 控件。输入字段可通过多种方式改变，取决于 type 属性。注意：accept 属性仅适用于 提示：请不要将该属性作为您的验证工具。应该在服务器上对文件上传进行验证。accept 属性规定了可通过文件上传提交的服务器接受的文件类型。type 属性规定要显示的 元素的类型。
2023-11-03 13:30:27
1735
原创 swiper3 无缝滚动 + 鼠标悬停停止/继续
mySwiper.stopAutoplay() 和 mySwiper.startAutoplay()是控制autoplay属性，无缝滚动是speed属性，mySwiper.stopAutoplay() 和 mySwiper.startAutoplay()可以实现鼠标悬停暂停和继续的效果，但是需swiper执行完speed规定值后再执行暂停，如果需要鼠标悬停立刻暂停，移开后继续需调整mySwiper.stopAutoplay() 和 mySwiper.startAutoplay()控制。
2023-10-24 11:03:54
1998
1
原创 Vue3:proxy数据取值proxy[Target]取值
vue3底层是使用proxy进行代理的，而proxy中[[Target]]才是想要的值。
2023-09-13 20:12:11
5650
原创 关于var、let、const相同与不同
str是console.log后定义的，因为var存在变量提升，所以当console.log输出str时，会去找有没有定义str，因赋值的顺序在console.log后面，所以console.log输出的结果显示undefined然后是赋值。函数内var声明的变量，在函数外也可以调用，但let、const声明的变量，只能在函数内使用，函数外不能调用。var、let声明变量，可重新赋值，const声明常量，因常量不能修改所以报错。var定义同名变量时，后面所定义的内容会覆盖前面的。
2023-07-13 10:58:35
234
原创 Vue3：Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘xxx‘）
在页面中渲染异步获取的数据，页面正常渲染的同时报错Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'xxx'）方法1、对askData进行判断
2023-05-24 15:06:15
2238
原创 Vue项目启动报错Error: error:0308010C:digital envelope routines::unsupported
在命令行输入：$env:NODE_OPTIONS="--openssl-legacy-provider"报错原因：现在使用的node版本和项目创建时的node版本不一致。
2023-04-28 16:09:39
935
2
原创 Vue3：computed()简单使用及使用computed格式化时间
接受一个 getter 函数，返回一个只读的响应式 ref 对象。该 ref 通过 .value 暴露 getter 函数的返回值。它也可以接受一个带有 get 和 set 函数的对象来创建一个可写的 ref 对象。computed（是组合式api，用时引入）
2023-04-15 18:11:36
597
原创 Vue3：返回组件（运用keepAlive保留滚动位置）
this.$router.go(-1) 返回上一页最简单实用，现通过路由传参及keepAlive，实现返回保留滚动条位置。注意这两个activated 和 deactivated 这两个生命周期钩子函数。
2022-09-16 11:47:19
5355
原创 基于swiper实现旋转木马轮播图（适配移动端）
注：这里引用的是swiper3.0，swiper3.0无需加载公用库：Swiper无需加载任何公共库（如jquery）即可运行，这保证了Swiper的轻量和运行速度。Swiper也可以在加载了公共库的环境下安全的运行，如jQuery, Zepto, jQuery Mobile等，但基于swiper仍需引入swiper相关的css及js。
2022-08-24 11:24:43
2256
原创 通过css实现简单的radio美化及radio在vue中的使用取值
将一个标签绝对定位覆盖在input标签（input标签透明处理可以防止遮挡遗漏）上，通过input[type="radio"]:checked+标签名实现选中和未选中区别.....
2022-08-12 10:30:57
931
原创 Vue3：监听textarea输入
textarea最大输入字符200，需设置maxlength="200"，通过length值来提示输入量。不设置maxlength也可以通过watch监听提示或者截除。
2022-07-20 16:38:58
2280
原创 Vue：按钮倒计时N秒后可用
报名信息提交后弹出信息确认（为方便查看效果，注掉了数据校验），五秒后提交按钮方可点击提交信息。JS：Vue：关于setInterval() 方法和clearInterval() 方法https://blog.csdn.net/millia/article/details/106675713?spm=1001.2014.3001.5501......
2022-07-01 16:14:40
2048
原创 Vue：push添加数据出现__ob__: Observer
__ob__: Observer这个后缀其实是Vue监控数据产生的，如果使用push添加数据就会出现__ob__: Observer
2022-06-25 16:47:32
1367
原创 Vue：执行完一个函数再执行另一个函数（Promise用法）
几个活动同时进行，开始结束时间不同。在点击报名时间需检测是否在活动期间。需要异步获取活动时间并跟当前时间进行比较。这里用到了Promisedata(){ return{ activeStart:"",//活动开始时间 activeEnd:"",//活动结束时间 }},methods:{ //获取活动时间(方法一) getActiveTime(event){ return new Promise((resolve, reject) => { ...
2022-05-25 15:18:49
12400
原创 Vue自定义弹出层（信息提示）组件
弹出层（不需要的可以在数据中注掉）效果如下：弹出层（信息提示）组件：<template><div class="PopLayerBg"><div class="PopLayer"><div class="popTitle" v-if="popData.title != '' && popData.title != undefined">{{popData.title}}</div><div class=.
2022-05-23 10:02:53
2469
原创 基于jQuery实现弹幕效果
效果如下：HTML：<div class="dmbg"><div class="dmHt"><img src="images/txt01.png"><span>已有<b>257864</b>人在此寄托了思念</span></div><div class="dmShow"><!--<div>祝家乡越来越繁荣昌盛，人们的生活也越来越富裕。</div>
2022-04-23 11:22:24
2071
3
原创 file美化
默认效果:选择文件效果:HTML:<li><label>上传照片</label><div class="fileBg"><input type="file" class="fileCheckUp"><span>未选择任何文件添加病情照片患处、检查报告或其他资料</span></div></li>CSS:.fileBg{background:url(image.
2022-03-21 17:19:40
271
原创 Vue由内容返回列表页保留滚动位置
列表页到详情页，详情页返回列表页保留列表页滚动条位置：router.js routes: [ { path: '/', name: 'index', //component: Home component: () => import('./views/index/index.vue'), meta: { keepAlive: true // 需要缓存 } }, {
2022-03-08 09:50:51
1150
1
原创 VUE简单的同父兄弟组件传值，父子组件传值及VUE3的$emit替代
同父兄弟组件传值：父组件：<template><div id="millia"><!--导航子组件--><top-nav @brotherPopShow="fatherPopShow"></top-nav><!--@brotherPopShow子组件接收方法名--><!--fatherPopShow父组件方法--><!-- 其他代码 --><!--弹出层子组件-->..
2022-01-11 11:27:00
284
原创 VUE：微信H5公众号页面禁用分享
JSSDK配置wx.config/** jssdk初始化* */export function initSdk(appId,nonceStr,signature,timestamp,apiList){ //从后端获取 wx.config({ debug: false, appId: appId, timestamp: timestamp, nonceStr: nonceStr, signature: signature, //jsApi...
2021-12-15 14:38:17
1958
3
原创 div滚动条从底部开始向上滚动
效果如下:HTML：<ul class="friendList"> <li><a href="#">中国政府网</a></li> <li><b>国务院部门网站</b> <div> <!--很长的隐藏二级链接--> <a href="#">友情连接网站</a> <a .
2021-09-18 14:23:44
581
原创 uniApp同级子组件间通讯及同父组件间的数据传递
HTML：<view class="whiteBg"><people-list :peopleListData="peopleListData" @getCoupon="fatherCoupon"></people-list><coupon-list :couponListData = "couponListData"></coupon-list></view>JS：<script>import Pe
2021-09-03 11:02:50
273
原创 uniApp之在伪类中使用iconfont
效果如下：THML：<view class="process"> <view class="ht">处理进度</view> <view class="processList"> <view v-for="(list,index) in processData.arrivalProcess" :key="index"> <text>{{list.content}}&l.
2021-08-26 10:48:15
309
原创 uniApp通过swiper和scroll-view实现带缩略图轮播
HTML:<view class="peopleSwiper"> <swiper class="bigImg" :current="current"> <swiper-item v-for="(big,index) in imgSwiperData" :key="index"> <image :src="big.imgUrl" mode="scaleToFill"></image> </...
2021-08-17 17:21:55
785
1
原创 Vue组件keepAlive实现返回上一页保存原数据
在页面中输入搜索条件跳转到详情页，从详情页返回要保留原页面输入的搜索条件及搜索的结果。效果如下：这里用到了vue的内部组件keepAliverouter.js注：列表页需要缓存 keepAlive: true，详情页不需要缓存 keepAlive: false routes: [ { path: '/', name: 'index', //component: Home component: () => import('..
2021-07-29 09:12:39
4942
原创 Vue消息列表已读/未读状态实时更新及数据更新set()用法
效果如下：代码部分：(HTML部分使用Element的Collapse 折叠面板)<template><el-collapse accordion><el-collapse-item v-for="(list,index) in noticeData" :key="index" ><template slot="title"><span v-if="list.status == 0">[未读]</span><
2021-07-23 09:01:17
7011
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人