- 博客(20)
- 收藏
- 关注
原创 js判断是否是移动端登录
/** * 判断是否移动端 */export const isMobile = () => { let sUserAgent = navigator.userAgent.toLowerCase(); let deviceTypeList = ['ipad', 'android', 'iphone', 'ipod']; for (let i = 0; i < deviceTypeList.length; i++) { if (sUserAgent.indexOf(dev.
2022-03-03 14:48:22 401
原创 vue写滑块组件
<template> <div @touchend="down = false" @touchmove="gotouchstart" class="pledge"> <!-- <div class="mask" @touchend="down = false" @touchmove="gotouchstart"></div> --> <div class="h2">調整質押率</div> <.
2022-02-17 16:59:27 2614
原创 动态创建对象
let items = {}let arr = [ { label: 'is_show', value: 1 }, { label: 'images', value: 2 }, { label: 'info', value: 3 }, { label: 'parameter', value: 4 }, { label: 'attr', value: 5 },]for (let item of arr) { items[item.label] = ite.
2022-02-16 17:28:12 350
原创 css和scss设置子元素样式
// css// 选择第一个元素.Cloud:first-child {}// 选择第七个元素.Cloud:nth-child(7) {}// 选择最后一个元素.Cloud:last-child {}// scss.Cloud { &:first-child {} &:nth-child(7) {} &:last-child {}}
2022-02-11 10:11:28 3409
原创 vue简介展示全部
这个主要是通过this.$refs.desc.offsetHeight获取简介高度是否超过3行,超过三行的高度则说明有被隐藏的部分,查看更多的按钮就会展示出来;<template> <div> <div class="container"> <div class="tooltip" v-show="tooltipShow">{{desc}}</div> <d...
2022-02-10 18:27:48 579
原创 vue实现虚拟列表
<template> <div id="app"> <div class="list-wrap" ref="listWrap" @scroll="scrollListener"> <div class="scroll-bar" ref="scrollBar"></div> <ul class="list" ref="list"> <li v-for="(val,i.
2022-02-08 10:18:12 598
原创 VUE组件日时分秒倒计时
因为产品说需要取服务器的时间戳,所以nowTime是从服务器取的当前时间戳,没有这个要求可以用new Date().getTime()代替;组件代码<template> <div class="DayDown"> <span>{{ dayString }}</span> <span>{{ hourString }}</span> <span>{{ minuteString }}</
2022-01-24 11:53:36 842
原创 vue封装H5弹窗
<template> <div class="prompt-dialog"> <div class="mask"></div> <div class="main"> <i class="close" @click="onClose"> <svg width="21" height="21" viewBox="0 0 2...
2021-12-10 17:15:18 1028
原创 什么是虚拟dom
1. 对虚拟DOM的理解?从本质上来说,Virtual Dom是一个JavaScript对象,通过对象的方式来表示DOM结构。将页面的状态抽象为JS对象的形式,配合不同的渲染工具,使跨平台渲染成为可能。通过事务处理机制,将多次DOM修改的结果一次性的更新到页面上,从而有效的减少页面渲染的次数,减少修改DOM的重绘重排次数,提高渲染性能。虚拟DOM是对DOM的抽象,这个对象是更加轻量级的对 DOM的描述。它设计的最初目的,就是更好的跨平台,比如Node.js就没有DOM,如果想实现SSR,那么一个方式
2021-12-09 15:17:42 3090
原创 数字保留位数,三位数添加分隔符
<div class="trad top_text"> {{ count | formatNumber(4, false, true) | formatMoney }}</div>// 格式化数字精度 val , precision 精度 ,isRound true 向上取值,false 向下取值,isWithOutZero:末尾是否包含0 formatNumber(val, precision, isRound = false, isWithOutZero =.
2021-12-08 15:46:18 390
转载 vue使用swiper轮播
npm install vue-awesome-swiper@3 --save-devnpm install swiper@3 --save-dev
2021-11-16 17:44:28 388
原创 vue关闭语法检查
新建 vue.config.js// vue.config.jsmodule.exports = { devServer: { overlay: { warnings: false, //不显示警告 errors: false //不显示错误 } }, lintOnSave: false //关闭eslint检查}需要关闭当前服务,重新运行才会生效。...
2021-11-05 15:55:16 14109 1
原创 自定义指令使文本框自动获取焦点
directives: { // 注册一个局部的自定义指令 v-focus focus: { // 指令的定义 inserted: function (el) { // 聚焦元素 el.querySelector("input").focus(); }, }, },<el-input v-focus></el-input>Vue 提供了自定义指令的5个钩子函数: bind.
2021-11-03 17:05:04 501
原创 css使数字和字母换行
遇到这种情况只需要在样式中加入word-break:break-all或word-break:break-word;word-break:break-all会使单词强制换行word-break:break-word不会使单词强制换行
2021-10-29 14:08:16 969
原创 css单行和多行文字省略
单行文字省略: overflow:hidden; text-overflow:ellipsis; white-space:nowrap;text-overflow:ellipsis;//文本溢出显示省略号white-space:nowrap;//文本不会换行多行文字省略: width: 100px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; ...
2021-10-29 12:26:17 201
原创 JS的map, filter, some, every, find的使用
1.map( ) :通过指定函数处理数组的每个元素,并返回处理后的数组。返回一个新的数组,每个元素为循环的结果;let list = [1, 2, 3, 4, 5];list = list.map((item) => { return item * 2;});console.log(list);// print: [2, 4, 6, 8, 10]2.filter( )......
2021-10-27 15:59:34 1266
原创 git命令行
Git 文件只有三种状态:已提交(committed),已修改(modified)和已暂存(staged)git clone git链接 克隆项目git branch 查看现有分支git branch -r 查看远程分支git checkout -b 分支名 分支模板名 新建分支,第二个参数不填则以当前所在分支为模板git checkout origin/分支名 切换分支git branch 分支名 新建分支git merge origin/被合并的分支名 将被合并...
2021-10-18 09:27:31 232
原创 ES6中的import * as obj from ‘xx‘
import * as obj from 'xx'会将xx中所有的export导出的内容组合成一个对象返回,这个对象就是obj;xx文件export function login(){ return 'login';}export function getData(){ return 'getData';}使用import * as obj from 'xx'引用时,使用obj.login(),obj.getData()调用;使用mport {logi...
2021-10-14 09:38:14 155
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人