- 博客(31)
- 收藏
- 关注
RSS订阅原创 解决vuex刷新数据丢失的问题
exportdefault{name:'App',created(){ //如果session中有store，则直接复制给vuexif(sessionStorage.getItem("store")){this.$store.replaceState(Object.assign({},this.$store.state,JSON.parse(sessionStorage.getItem("store"))))}...
2020-09-24 10:32:43
190
原创 数组中对象相同字段合并处理
//分层级，数组扁平化处理 let json = [ { checked: true, key: "tgi_popu_base_age#1979:1975", leaf: 1, onek...
2020-04-24 12:53:24
922
原创 vue 自定义指令 directive
vue自定义指令顾名思义，就是vue给我们提供的一个编写各种指令的入口。比如v-for,v-if ,v-show等，根据实际业务需求有时会用到自定义指令，一定程度上可以解决过滤器并承担部分组件功能的作用。但是总体而言，由于指令需要操作dom,因此能用组件就不用指令。言归正传：写一个v-focus <body> <div id="app">...
2020-01-15 15:10:06
299
原创 验证手机号
var phone = "13622993358"if (!(/^1[3456789]\d{9}$/.test(phone))){ console.log("phone error") }
2019-11-05 12:06:43
296
1
原创 css多行文字溢出隐藏
overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;//设置行数//单行overflow:hidden;text-overflow:ellipsis;white-space:nowrap;...
2019-08-20 17:22:35
345
原创 微信小程序底部弹框
<view wx:if="{{dialong}}" class="boxs {{dialong?'moves':''}} ">内容</view>.dialong{position: fixed;width: 100%;height: 100%;z-index: 99;top: 0;background: rgba(0,0,0,0.4)}....
2019-08-20 16:23:05
457
原创 多个tab切换时选中的在中间
好久没有写博客了，刚好朋友有需求，就写了个demo,并记录一下以便日后使用<scroll-view class="scrollx" scroll-with-animation scroll-x bindscroll="bindscroll" scroll-left='{{scrollLeft}}'><view class="list_warp"><view...
2019-08-02 14:28:13
1283
原创 reduce总结
//数组中出现最多的次数 var arr = [1, 2, 3, 4, 2, 1, 1, 1, 1] let newNum = arr.reduce((pre, cur) => { if (cur in pre) { pre[cur]++ ...
2019-05-23 10:36:21
238
原创 获取验证码
getYzm(){if(this.data.telephone.length != 11){wx.showToast({title: '您输入的手机号码有误',icon:'none'})return}this.getCode()this.setData({disabled:true})},getCode(options) {var that ...
2019-05-14 11:36:02
260
原创 微信小程序文字轮播禁止手动滑动
<swiper class="swiper_container" vertical="true" autoplay="true" circular="true" interval="2000"><block wx:for="{{msgList}}" wx:key="{{index}}"><view bindtap='goDetail' data-index='...
2019-05-14 11:32:11
1156
转载 左滑删除
<view class="container1"><view class="touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" data-index="{{index}}" bindtouchstart="touchstart" bindtouchmove="touchmove" wx:for="{{item...
2019-05-14 10:45:17
274
原创 微信小程序转盘大抽奖
有需要写个积分抽奖功能，大题思路就有两个，一呢转盘上的内容使用文字，自己调整位置和角度，二呢使用整个的图片，优缺点一目了然。比较懒就借鉴了第二种：首先在js中全局定义：//微信提供的创建动画的方法const animation = wx.createAnimation({duration: 6000,timingFunction: 'ease'})Page({/...
2019-05-10 16:48:04
1413
原创 最常用的小程序demo
wx-gesture-lock微信小程序的手势密码WXCustomSwitch微信小程序自定义 Switch 组件模板WeixinAppBdNovel微信小程序demo：百度小说搜索shitoujiandaobu小程序：石头剪刀布（附代码说明）audiodemo微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义star微信小程序开发之五星评分swit...
2019-05-09 17:00:03
1130
原创 富文本编辑器前端图片直传oss
使用的wangeditor ,踩了一天的坑，终于OKvue+element + wangeditornpm i wangeditor<<template><div class='warp'><div id="editorElem" class="toolbar" ></div><div id="div2" ...
2019-04-11 11:50:11
1019
原创 vue 项目中的 websocket
app中一直在用个推进行推送，今天和后端的小伙伴一起尝试了下websocket,总结一下。首先websocket是js向服务器发出连接的一种请求，是h5提出的一种协议，之前的理解就是用了它当状态变化时，后端直接通知前端，很有用。看了一下菜鸟教程，写的很详细，整体感觉websocket没有想象中的那么复杂。上代码//创建一个socket对象，这个对象有五个方法，onopen,onmess...
2019-04-03 12:33:44
1213
原创 微信小程序点击返回并随意操作上个页面
var pages = getCurrentPages(); var currPage = pages[pages.length - 1]; //当前页面 var prevPage = pages[pages.length - 2]; //上一个页面 //直接修改上个页面的值 prevPage.setData({ storeId: id...
2019-04-02 17:48:46
958
原创 日期
owner.ymd = function (time) { var y = new Date(time).getFullYear() var m = new Date(time).getMonth() + 1 var d = new Date(time).getDate() m = (m < 10) ? '0' +...
2018-11-23 16:47:42
177
原创 ios提示更新版本
plus.runtime.getProperty(plus.runtime.appid,function(inf){ var curVersion = inf.version; $.ajax({ ...
2018-11-20 12:28:34
638
原创 银行卡号每四位添加一个空格
前端页面展示需要加上空格，this.cardnum.replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ');而上传后台时往往需要去掉空格，this.cardnum.replace(/\s/g, "")金额最多输入小数点后两位this.amountPrice.replace(/^(\-)*(\d+)\.(\d\d).*$/, ...
2018-10-17 09:53:08
3334
原创 vue文字轮播插件
目前看到有用的插件就会保留，不为别的，就是想以后遇到同样的问题能及时高效的解决，前两天分享了app项目中的文字轮播。今天搞下vue中的吧，以便后用。1、安装这个插件 npm i vue-seamless-scroll --save 2、在需要文字轮播的页面中引入 import vueSeamless from 'vue-seamless-scroll'e...
2018-09-26 17:23:45
2638
原创 获取手机当前位置
mui.plusReady(function() { plus.geolocation.getCurrentPosition(MapPoint, function(e) { mui.toast("error:" + e.message); }) }) ...
2018-09-26 17:15:18
1496
2
原创 vue加载更多
//很low的加载更多，仅供自己参考，如若有更好的欢迎提出1、加载更多在很多评论、列表中有广泛应用，思路就是每页10条的话，滚到底部后触发一个事件，在mounted中写上事件 window.addEventListener('scroll', this.handleScroll)，其中this.handleScroll指的是methods中的一个方法，...
2018-09-25 16:13:32
1442
原创 mui传参
父页面：mui.openWindow({ url: 'szdetail.html', show: { aniShow: 'pop-in' }, ...
2018-09-25 15:53:02
509
原创 超简单的文字轮播
这是一段耐人寻味的代码，当然了你想看就看，不想看就直接跳过。两分钟即可写出文字轮播，因为这是封装的一个js文件，主要是使用简单。。。。$.fn.extend({ Scroll: function(opt, callback) { //参数初始化 if (!opt) var opt = {}; var _this = this.eq(0)....
2018-09-21 10:53:39
2820
原创 mui返回上个页面并刷新数据
今天写项目遇到个问题，就是B页面支付操作完成以后，点击返回按钮要到A页面，此时A页面的余额需要刷新，无论是vue项目还是app项目好像并没有用到过这个东西。好一阵的头大，用的mui框架，网上能找的方法几乎都试了，不知道原因所以无法解决。最后终于弄清楚了原因。B页面这样写：mui.init({ beforeback: function() { ...
2018-09-19 11:14:38
9571
5
原创 vue组件
什么是组件？Component（组件）是vue最强大的功能之一，作用是可以看扩展、封装可重用的代码，比如Css，HTML，因为定义好一个组件以后再另外一个界面通过import既可引入，一个标签就解决了复用的问题。组件的存在让我们可以通过复用的小组件构建大型的应用。<div id="app"> <temp></temp></div>//注册组件V...
2018-07-11 09:36:14
159
原创 vue手机端项目自适方案
lib-flexible解决移动端自适应花了一个多小时终于解决了这个问题，最近总是在研究如何做好自适应，搜了很多方法，但是总是感觉不尽人意，比如以实际尺寸除以75得出rem，或者是那种px乘以二的，因为之前不太清楚清楚，导致不能理解。功夫不负有心人，总算总结了一个比较满意的方法。利用淘宝给出的lib-flexible,解决。首先安装它，npm i lib-flexible --save，计算起来比...
2018-07-06 11:43:31
721
原创 import vue from vue
起初看到这样写，也没有管是什么意思，只是别人这样写，我也这样写，反正会用就成，再说了使用vue脚手架生成项目后在main.js中就有这玩意。今天吃饭的时候就好好研究了一下，没有办法，正在成长的道路上。import vue form 'vue'如果写全的话是import vue from '../nodemouls/vue/list/vue.js'这样写显然十分的不方便，此时在webpack.bas...
2018-07-05 12:53:54
3779
原创 vue项目中给title添加图片的方法
如果是普通的html页面， 需要在head中写<link rel="icon" href="图片路径"> 其中rel表示当前资源或当前文档与被链接资源之间的关系。而如果是vue项目中，需要在bulid中 修改 webpack.prod.conf.js 和 webpack.dev.conf.js 文件，分别在里面加入下面这句代码 favicon: path.resolve('图片路径')...
2018-06-29 19:14:04
3906
转载 vue脚手架的搭建
开发环境1.安装webpacknpm install -g webpack12.安装vue-clivue-cli是什么？vue-cli 是vue.js的脚手架，用于自动生成vue.js模板工程的。使用步骤：安装vue-cli：npm install -g vue-cli1使用vue-cli构建项目vue init webpack project-name //创建一个基于webpack模板的名为p...
2018-06-29 13:51:20
254
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人