自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 uni-app 页面横向点击居中

uni-app横向点击居中 1.使用scroll-view可滚动视图区域。2.动态计算横向滚动条位置scroll-left。uni-app 页面横向点击居中。

2022-11-19 15:38:31 922

原创 vue js 多个对象拼接(变量名key拼接 + 值value拼接)

vue js 多个对象拼接(变量名key拼接 + 值value拼接)

2022-10-13 18:40:59 3811

原创 Vue 动态变量名

vue在页面多个变量里面都有value这个单词,所以我把value拿出来,动态展示。

2022-08-25 14:06:58 2537

原创 js+vue+jq左右分类联动效果

js+vue+jq左右分类联动效果,左侧固定,右侧分类联动的效果。

2022-08-25 08:55:49 338

原创 css height为auto的transition过渡效果--max-height

手风琴效果,展开时根据内容自适应高度即从height: (any)px; 变化到 height: auto; 此时设置transition不会产生效果, 原因是 transition 无法将 ()px 变为不是具体数值的 auto解决方法:设置max-height,max-height尽可能最大,transition也要设置max-height;我一开始写的height,一直没有效果。<div class="motxt" @click.stop="getmorerule()">更多规则&

2022-04-11 10:32:08 2655 1

原创 不同状态下刷新显示不同的倒计时

不同状态下刷新显示不同的倒计时在一个页面中可能会遇到在几个不同的状态下显示倒计时,刷新后会同时显示几种倒计时在不停地跳动,找到原因是因为没有使用计时器,并消除计时器。htmlinfo.status==‘1’ || info.status==‘2’ 两种状态<div id="app"> <div class="timebox" v-if="info.status=='1'"> <div class="times">

2022-03-08 17:49:24 136

原创 vue-星星评分带小数点

效果图重点:我用的是总评分5分,一组5个星星······total:5,//星星总数;······v-for=“star in total”每个星星的尺寸······size:4.5,······//宽4.5vw,高4.5vw; var vm = new Vue({ el:'#app', data:{ star:'4.6',//总分 total:5,//星星总数 size:4.5,//尺寸 }, })小数点的星星评分展示,需要用到两组星星,一组是底部的暗色星星,一组

2022-02-24 10:59:00 1046 2

原创 vant.js-van-calendar日历-日期选择(自定义区间选择/ios的Invalid Date格式)

日历选择区间使用vant.js的calendar日历,由于特定场景需要自定义日期区间(代码中默认选择昨天和今天)重点::default-date**vant.js传的时间 (2021, 11, 1),需要转为Wed Dec 01 2021 00:00:00 GMT+0800 (中国标准时间) ----new Date(2021, 11, 1):poppable="false"将 poppable 设置为 false,日历会直接展示在页面内,而不是以弹层的形式出现。type 选择类型:s

2022-02-23 15:13:04 15875

原创 vue-发布评论(星星打分,快捷输入)

重点:星星打分 tapmode @click=“count=i+1” :class=“count>i?‘c-f83600 iconshoucang1’:‘iconshoucang’”;快捷输入的js,选取某项或取消选取的功能;1.星星打分<div class="starli align-center"> <div class="starname">整体评价</div> <div class="stars align-cente

2022-02-23 13:49:10 643

原创 vue列表倒计时

如图10分钟倒计时在做项目的时候遇到vue列表要用到倒计时的方法,想直接在页面中处理,使用vue过滤器。<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1

2022-02-23 09:12:48 1303 2

原创 js点击居中

<style>#app{ min-height:100vh; .typebox{ overflow-x: auto;white-space:nowrap;width: auto;margin:5.33vw auto 0;position: sticky;position: -webkit-sticky;z-index:20;padding:1vw 3.2vw 2.13vw; .typeli{ display: inline

2022-01-19 15:23:50 918

原创 背景加透明度 字体透明度不变

<style>#app{ min-height:100vh; .header{ min-height:12vw;position:sticky;position:-webkit-sticky;top:0;left:0;right:0;width:100vw;z-index:999;box-sizing:border-box; .header1{ height:12vw;line-height:12vw;

2022-01-19 15:14:59 3166

原创 高亮关键字

<div v-html="TitleLight(vo.goods_name)"></div>TitleLight:function(titleInfo) { const strReturn = titleInfo.replace(new RegExp(vm.keywords, 'g'), `<span class="highlight">${vm.keywords}</span>`) return strReturn },

2022-01-19 14:51:43 156

原创 CSS ul 横向滑动并超出屏幕可滑动

方案一:第一步 ul 中的css设置 <ul id = "list"> </ul>#list { overflow-x: auto; //设置x轴可滑动 list-style: none;//去掉li上的小点 white-space:nowrap;//元素不换行 width: auto;(宽度) }第二步 li中的css设置 <li class = "item">.item { margin-left: 20px; //每个li设置间距为20px display:

2022-01-19 14:21:47 3137

原创 vue项目一

最近自己刚接触vue框架,尝试着自己创建一个vue项目,准备记录下这个过程。一、创建vue项目1.安装node到官网下载安装,我这里是win7系统。(中)https://nodejs.org/zh-cn/(英)https://nodejs.org/en/2.安装cnpm镜像(node自带安装了npm,故不再安装)$ npm install -g cnpm --registry=ht...

2019-08-31 23:22:14 198 1

原创 对Vue组件传值的初印象

最近学了vue的组件间的传值,通过模板语法文档,再结合生活的例子,写下此篇博客,敬请评论留言指导!一、父组件给子组件传值<body>//父 <div id="app"> <my-content test = "测试"/> //---① </div></body>//子<template id="conte...

2019-08-22 23:24:18 243 2

原创 初识MV*

MVC最早出现在java中,后来前端开发中也提到了,之后出现了MVP,然后改进又出现了目前最成熟的MVVM。MVC(Model View Controller),是模型(Model)-视图(View)-控制器(Controller)的缩写。用一种业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑。View(...

2019-08-19 21:13:14 158 2

原创 命令行操作Mongodb

命令行操作Mongodb准备工作:1.D盘mongodb文件夹内解压下载好的mongodb文件2.D盘根目录下创建一个文件夹data,在data内部再创建一个文件夹db3.进入到mongodb的bin目录4.按住shift,点击鼠标的右键,打开命令行窗口,输入如下指令打开数据库连接池mongod --dbpath d:\data\db (我的要写.\mongod ...

2019-08-19 08:09:18 1167 1

空空如也

空空如也

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

TA关注的人

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