Millia's work
米柆
国家一级保护废物
展开
-
svg图标填充渐变色及CSS鼠标悬停纯色渐变色转换
【代码】svg图标填充渐变色及CSS鼠标悬停纯色渐变色转换。原创 2024-04-25 09:19:02 · 375 阅读 · 0 评论 -
Vue3:Axios配置及使用
在package-lock.json文件可以查看axios版本milliaAxios.js 配置axiosapi.js 接口基地址及接口路径api.js里的基地址和代理接口 需同vue.config.js的配置一致,即。原创 2024-01-09 10:18:57 · 1190 阅读 · 0 评论 -
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 · 1954 阅读 · 0 评论 -
时间与时间戳转换比较及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 · 822 阅读 · 0 评论 -
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 阅读 · 0 评论 -
Vue3:一页多题答案提示及循环radio和checkbox混合使用
一页多题,类型包括单选,判断多选,涉及radio和checkbox同时使用,数据提交。原创 2023-11-05 12:29:23 · 374 阅读 · 0 评论 -
文件上传input type=“file“之accept接受的类型汇总
规定了用户可以在其中输入数据的输入字段。 元素在 元素中使用,用来声明允许用户输入数据的 input 控件。输入字段可通过多种方式改变,取决于 type 属性。注意:accept 属性仅适用于 提示:请不要将该属性作为您的验证工具。应该在服务器上对文件上传进行验证。accept 属性规定了可通过文件上传提交的服务器接受的文件类型。type 属性规定要显示的 元素的类型。原创 2023-11-03 13:30:27 · 1744 阅读 · 0 评论 -
Vue3:checkbox使用及限制选中数量
【代码】Vue3:checkbox使用及限制选中数量。原创 2023-10-30 11:08:35 · 543 阅读 · 0 评论 -
关于Axios发请求(get或post)数据参数问题
简单配置Axios(没有封装get和post方法)原创 2023-06-13 15:53:00 · 482 阅读 · 0 评论 -
Vue项目启动报错Error: error:0308010C:digital envelope routines::unsupported
在命令行输入:$env:NODE_OPTIONS="--openssl-legacy-provider"报错原因:现在使用的node版本和项目创建时的node版本不一致。原创 2023-04-28 16:09:39 · 936 阅读 · 2 评论 -
HTML特殊字符符号
HTML特殊字符符号大全原创 2022-12-08 14:24:51 · 304 阅读 · 0 评论 -
Vue:对象数组多重循环
vue对象数组多重循环原创 2022-11-16 20:22:16 · 890 阅读 · 0 评论 -
Vue3:返回组件(运用keepAlive保留滚动位置)
this.$router.go(-1) 返回上一页最简单实用,现通过路由传参及keepAlive,实现返回保留滚动条位置。注意这两个activated 和 deactivated 这两个生命周期钩子函数。原创 2022-09-16 11:47:19 · 5365 阅读 · 0 评论 -
基于swiper实现旋转木马轮播图(适配移动端)
注:这里引用的是swiper3.0,swiper3.0无需加载公用库:Swiper无需加载任何公共库(如jquery)即可运行,这保证了Swiper的轻量和运行速度。Swiper也可以在加载了公共库的环境下安全的运行,如jQuery, Zepto, jQuery Mobile等,但基于swiper仍需引入swiper相关的css及js。原创 2022-08-24 11:24:43 · 2259 阅读 · 0 评论 -
Vue:页面内跳转锚点的使用
点击文字跳转当前页的某一个位置,或点击导航在当前页内多个位置跳转。原创 2022-08-16 15:43:19 · 2450 阅读 · 0 评论 -
通过css实现简单的radio美化及radio在vue中的使用取值
将一个标签绝对定位覆盖在input标签(input标签透明处理可以防止遮挡遗漏)上,通过input[type="radio"]:checked+标签名实现选中和未选中区别.....原创 2022-08-12 10:30:57 · 931 阅读 · 0 评论 -
Vue3:监听textarea输入
textarea最大输入字符200,需设置maxlength="200",通过length值来提示输入量。不设置maxlength也可以通过watch监听提示或者截除。原创 2022-07-20 16:38:58 · 2281 阅读 · 0 评论 -
Vue:push添加数据出现__ob__: Observer
__ob__: Observer这个后缀其实是Vue监控数据产生的,如果使用push添加数据就会出现__ob__: Observer原创 2022-06-25 16:47:32 · 1368 阅读 · 0 评论 -
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 · 2049 阅读 · 0 评论 -
Vue:简单的select联动
区域请选择学校所在区域原创 2022-06-22 20:33:41 · 1447 阅读 · 0 评论 -
Vue:执行完一个函数再执行另一个函数(Promise用法)
几个活动同时进行,开始结束时间不同。在点击报名时间需检测是否在活动期间。需要异步获取活动时间并跟当前时间进行比较。这里用到了Promisedata(){ return{ activeStart:"",//活动开始时间 activeEnd:"",//活动结束时间 }},methods:{ //获取活动时间(方法一) getActiveTime(event){ return new Promise((resolve, reject) => { ...原创 2022-05-25 15:18:49 · 12402 阅读 · 0 评论 -
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 阅读 · 0 评论 -
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 评论 -
checkbox美化之伪类实现checked相应文字提示
【代码】checkbox美化之伪类实现checked相应文字提示。原创 2022-01-10 16:52:31 · 533 阅读 · 0 评论 -
VUE简单的同父兄弟组件传值,父子组件传值及VUE3的$emit替代
同父兄弟组件传值:父组件:<template><div id="millia"><!--导航子组件--><top-nav @brotherPopShow="fatherPopShow"></top-nav><!--@brotherPopShow子组件接收方法名--><!--fatherPopShow父组件方法--><!-- 其他代码 --><!--弹出层子组件-->..原创 2022-01-11 11:27:00 · 289 阅读 · 0 评论 -
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 阅读 · 0 评论 -
基于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 评论 -
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 阅读 · 0 评论 -
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 阅读 · 0 评论 -
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 阅读 · 0 评论 -
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 阅读 · 0 评论 -
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 · 7014 阅读 · 6 评论 -
Vue分页及页码跳转
【代码】Vue分页及页码跳转。原创 2021-07-19 09:54:45 · 3312 阅读 · 0 评论 -
<video>标签及属性说明
实例HTML <video> 标签一段简单的 HTML5 视频:<video src="video.mp4" controls="controls">您的浏览器不支持 video 标签。</video>属性性 值 描述 autoplay autoplay 如果出现该属性,则视频在就绪后马上播放。 controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。 height原创 2021-06-30 15:10:06 · 56629 阅读 · 1 评论 -
Vue列表滚动底部加载更多及Scroll在IOS下兼容问题导致数据重复的解决
列表滑动至底部加载更多,效果如下:Android下效果如期,在Ios下会出现在屏幕滑动时会多次触发scroll事件给后台发送请求,导致申请数据重复的问题, 解决方法是定义一个全局变量,每次申请数据时都去判断这个变量的值。HTML:<ul class="List"> <li v-for="(list,id) in listData" :key="id" @click="ToContent(list.orderid)"> <span原创 2021-06-26 12:24:16 · 1054 阅读 · 0 评论 -
:class的使用及通过:class实现标签切换状态改变
做一个点击标签切换的功能,效果如下:JS:当然也可以酱紫写:JS:二、点击标签加载相应标签的内容:HTML:CSS:JS:三、三状态切换:一般用于可选/不可选/选中三种情况:Css:JS:四、更多状态结合:HTML:CSS:JS:附::class的使用(官方文档)1、:class="变量名",一般是直接绑定一个类名2、:class = "{ 类名:布尔值 }"原创 2021-06-25 10:57:16 · 4380 阅读 · 1 评论 -
Vue列表点击跳转外部链接
页面效果是酱紫的:给了一套酱紫的数据,需要点击观看回放的时候跳转到不同的连接地址(reback字段)[ { "id": 1, "name": "只楚街道", "reback":"https://xxxxx.com/live/tvchat-1430991900?v=1615941114578#/", "state": 2, "time":"17:00" },{ "id": 2,原创 2021-03-17 16:35:51 · 1029 阅读 · 0 评论 -
微信小程序使用Vant Weapp配置详解
一、创建package.json文件:1、在跟目录下右键选择在外部中断窗口中打开2、在打开的命令行工具中输入:npm init (按默认一直回车)配置并生成package.json文件3、在打开的命令行工具中继续输入:npm install(安装npm包)npm支持官方说明二、Vant Weapp安装设置:1、继续在命令行工具中输入:npm i @vant/weapp -S --production2、修改 app.json,将 app.json 中的"st...原创 2021-02-05 10:57:54 · 583 阅读 · 1 评论