|
Mac下MySql启动
sudo chown -R mysql /usr/local/mysql/data
sudo /usr/local/mysql/support-files/mysql.server start
获得状态栏导航栏高度(uniapp)
onReady() {
// 获得状态栏导航栏高度
var that = this
uni.getSystemInfo({
success(e) {
let statusBar = 0
let customBar = 0
// #ifdef MP
statusBar = e.statusBarHeight
customBar = e.statusBarHeight + 45
if (e.platform === 'android') {
customBar = e.statusBarHeight + 50
}
// #endif
// #ifdef MP-WEIXIN
statusBar = e.statusBarHeight
// @ts-ignore
const custom = wx.getMenuButtonBoundingClientRect()
customBar = custom.bottom + custom.top - e.statusBarHeight
// #endif
// #ifdef MP-ALIPAY
statusBar = e.statusBarHeight
customBar = e.statusBarHeight + e.titleBarHeight
// #endif
// #ifdef APP-PLUS
statusBar = e.statusBarHeight
customBar = e.statusBarHeight + 45
// #endif
// #ifdef H5
statusBar = 0
customBar = e.statusBarHeight + 45
// #endif
if (e.platform === 'android') {
that.statusBar=0
}else{
that.statusBar=statusBar
}
that.customBar = customBar
const query = uni.createSelectorQuery().in(this);
query.select('#editor').boundingClientRect(data => {
that.domHeight = data.height
}).exec();
}
})
},
npm设置淘宝镜像
npm i -g cnpm --registry=https://registry.npm.taobao.org
html转码
this.desc = this.changeHtml(data.data.desc.content)
changeHtml(str) {
var arrEntities = {
'lt': '<',
'gt': '>',
'nbsp': ' ',
'amp': '&',
'quot': '"'
};
return str.replace(/&(lt|gt|nbsp|amp|quot);/ig, function(all, t) {
return arrEntities[t];
})
},
提取富文本中的img标签中的src属性值
var arr=[]
var desc=this.changeHtml(list[i].content)
desc.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match, capture) {
arr.push(capture)
});
map['content'] =arr
设置富文本中图片大小
const regex = new RegExp('<img', 'gi')
this.desc = this.changeHtml(data.data.desc.content).replace(regex,`<img style="max-width: 100%; height: auto"`);
时间戳转日期
this.formatDate(data.data.desc.add_time * 1000)
formatDate(value) {
let date = new Date(value)
let y = date.getFullYear()
let m = date.getMonth() + 1
let d = date.getDate()
y = y < 10 ? ('0' + y) : y
m = m < 10 ? ('0' + m) : m
d = d < 10 ? ('0' + d) : d
return y + '.' + m + '.' + d
},
时间戳转时间
this.formatTime(data.data.desc.add_time * 1000)
formatTime(value) {
let date = new Date(value)
let h = date.getHours()
let m = date.getMinutes()
let s = date.getSeconds()
h = h < 10 ? ('0' + h) : h
m = m < 10 ? ('0' + m) : m
s = s < 10 ? ('0' + s) : s
// return h + ':' + m + '-' + s
return h + ':' + m
},
计算多长时间之前
handlePublishTimeDesc(value) {
// 拿到当前时间戳和发布时的时间戳，然后得出时间戳差
var curTime = parseInt(new Date().getTime() / 1000);
var postTime = new Date();
var timeDiff = curTime - value;
// 单位换算
var min = 60;
var hour = min * 60;
var day = hour * 24;
var week = day * 7;
var month = week * 4;
var year = month * 12;
// 计算发布时间距离当前时间的周、天、时、分
var exceedyear = Math.floor(timeDiff / year);
var exceedmonth = Math.floor(timeDiff / month);
var exceedWeek = Math.floor(timeDiff / week);
var exceedDay = Math.floor(timeDiff / day);
var exceedHour = Math.floor(timeDiff / hour);
var exceedMin = Math.floor(timeDiff / min);
// 最后判断时间差到底是属于哪个区间，然后return
if (exceedyear < 100 && exceedyear > 0) {
return exceedyear + '年前';
} else {
if (exceedmonth < 12 && exceedmonth > 0) {
return exceedmonth + '月前';
} else {
if (exceedWeek < 4 && exceedWeek > 0) {
return exceedWeek + '星期前';
} else {
if (exceedDay < 7 && exceedDay > 0) {
return exceedDay + '天前';
} else {
if (exceedHour < 24 && exceedHour > 0) {
return exceedHour + '小时前';
} else {
return exceedMin + '分钟前';
}
}
}
}
}
},
html文字超过部分显示为省略号
overflow: hidden;
text-overflow: ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
文字滑动（手动）
overflow-x: scroll;white-space: nowrap;width: 100%;
判断身份证
var regIdNo = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if (this.str_card_id != ''){
if (!regIdNo.test(this.str_card_id)) {
alert('身份证号填写有误');
return false;
}
}
判断电话
var myreg1 = /^1(3|4|5|6|7|8|9)\d{9}$/;
if(this.str_tel!=''){
if(!myreg1.test(this.str_tel)){
uni.showToast({
title: "手机号码格式不正确",
icon:"none"
})
this.flag_popul=false
return false;
}
}
判断小数点后输入限制
var myreg = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/;
if (!myreg.test(this.str_price)) {
uni.showToast({
title: "请小数点后填写两位",
icon: "none"
})
return false
}
拨打电话
way_call(){
uni.makePhoneCall({
phoneNumber: this.orderData.driver_phone //仅为示例
});
},
复制文字
uni.setClipboardData({
data: value
});
点击切换隐藏显示内容
:style="'overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: '+hang+';'"
data() {
return {
hang: 2,
flag_hang: true,
}
},
way_desc() {
this.flag_hang = !this.flag_hang
if (this.flag_hang) {
this.hang = 2
} else {
this.hang = 10
}
},
uniapp页面跳转传递复杂参数
A:
uni.navigateTo({
url: '/pages/web-view/web-view?url=' +encodeURIComponent(JSON.stringify(list))
})
B:
this.url= JSON.parse(decodeURIComponent(options.url))
背景颜色渐变
background-image: linear-gradient(to right , #3431DD, #3B5EFE);
uniapp的轮播
<swiper class="swiper" autoplay="true" interval="5000" duration="1500" circular="true">
<block v-for="(item,index) in bannerData" :key="index">
<swiper-item previous-margin="10px" next-margin="10px">
<image style="width: 100%;height: 100%;border-radius: 10rpx;" :src="item.banner_img" mode="scaleToFill"></image>
</swiper-item>
</block>
</swiper>
设置背景图片（app)
width: 100%;
height: 100%;
background-image: url(../../static/images/bg3.png);
background-repeat: no-repeat;
background-size: 100% 100%;
小程序设置背景图片
<image style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: -1;bottom: 0;right: 0;" src="../../static/images/bg4.png"></image>
获得状态栏高度(小程序，app)
<template>
<view>
<view class="status_bar">
//这里是状态栏
</view>
</view>
</template>
<style>
.status_bar {
height: var(--status-bar-height); //这里是状态栏css变量
width: 100%;
}
</style>
onLoad() {
let that = this;
wx.getSystemInfo({
success: function(res) {
res.statusBarHeight; //这就是状态栏的高度
},
});
},
自定义状态栏
pages.json:
"navigationStyle": "custom"
小程序自定义状态栏+标题栏高度
<view class="status_bar"></view>
<view:style="'width: 100%;height:'+height+ 'px;display: flex;justify-content: flex-start;align-items: center;background-image: linear-gradient(to right , #FF9494, #FE3E3E);'">
<image src="../../static/images/search.png" style="width: 33rpx;height: 33rpx;margin-left: 33rpx;"></image>
</view>
onLoad() {
let that = this
uni.getSystemInfo({
success: e => {
let StatusBar = e.statusBarHeight;
let rect = wx.getMenuButtonBoundingClientRect();
if (e.system.toLowerCase().indexOf('ios') > -1) {
//IOS
let CustomBar = rect.bottom + (rect.top - e.statusBarHeight) * 2;
that.height = CustomBar - e.statusBarHeight;
} else {
//安卓
let HeaderBar = rect.height + (rect.top - e.statusBarHeight) * 2;
that.height = HeaderBar + e.statusBarHeight;
}
}
});
},
.status_bar {
height: var(--status-bar-height); //这里是状态栏css变量
width: 100%;
background-image: linear-gradient(to right, #FF9494, #FE3E3E);
}
pages.json:
"navigationStyle": "custom"
拆分图片
var img = goodsData.goods_img.split("###")
var arr = img.filter(function(el) {
return el !== '';
});
this.goodsImg = arr
/uni.navigateBack({})返回携带参数
go_back() {
let pages = getCurrentPages(); //获取所有页面栈实例列表
let nowPage = pages[pages.length - 1]; //当前页页面实例
let prevPage = pages[pages.length - 2]; //上一页页面实例
prevPage.$vm.tagIndex = this.index; //修改上一页data里面的searchVal参数值为1211
uni.navigateBack({ //uni.navigateTo跳转的返回，默认1为返回上一级
delta: 1
});
// uni.navigateBack({})
},
弹框
var that=this
uni.showModal({
title: '提示',
content: '这是一个模态弹窗',
showCancel:true,
success: function (res) {
if (res.confirm) {
console.log('用户点击确定');
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
uniapp回到顶部
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
uniapp请求接口
uni.request({
method: "POST",
url: this.httpUrl + '5fe01e7abc95d',
header: {
'content-type': "application/x-www-form-urlencoded"
},
data: {
},
success: (res) => {
console.log("====" + JSON.stringify(res))
var data = res.data;
if (data.code == 1) {
} else {
uni.showToast({
title: data.msg,
icon: "none"
});
}
}
});
比较日期大小
compareDate(dateTime1,dateTime2) {
var formatDate1 = new Date(dateTime1)
var formatDate2 = new Date(dateTime2)
if(formatDate1 > formatDate2) {
return true;
}else {
return false;
}
},
判断日期相差几天
count(date1,date2) {
var date1 = new Date(date1);
var date2 = new Date(date2);
var date = (date2.getTime() - date1.getTime()) / (1000 * 60 * 60 * 24); /*不用考虑闰年否*/
return date
},
//多选
<view v-if="isActive.indexOf(1)==-1"></view>
item(index) {
if (this.isActive.indexOf(index) == -1) {
console.log(index) //打印下标
this.isActive.push(index); //选中添加到数组里
} else {
this.isActive.splice(this.isActive.indexOf(index), 1); //取消
}
},
小程序button去除边框
button::after{ border: none; }
小程序分享
<button open-type="share">分享</button>
onShareAppMessage(res) {
return {
title: '多选',
desc: this.title,
path: '/pages/answer/recording-duo?correct_num='+this.dui+'&error_num='+this.cuo+'&answer_title='+this.title+'&score='+this.score,
imageUrl: "",
success: res => {
},
fail: err => {
},
}
},
js去除数组对象中的重复对象
1.
var arr = [
{id: 1, name: 'sli', year: 2012},
{id: 2, name: 'ap', year: 2015},
{id: 1, name: 'alslion', year: 2012},
{id: 3, name: 'pose', year: 2012},
]
//删除arr中的重复对象
var newArr= [];
var arrId = [];
for(var item of arr){
if(arrId.indexOf(item['id']) == -1){
arrId.push(item['id']);
newArr.push(item);
}
}
console.log(arrId,newArr);
2.
var arr = [
{name:'uzi',color:'blue'},
{name:'pdd',color:'white'},
{name:'mlxg',color:'orange'},
{name:'uzi',color:'red'},
]
let hash = {};
var newArr = arr.reduce((item, next) => {
hash[next.name] ? '' : hash[next.name] = true && item.push(next);
return item
}, []);
console.log(newArr);
//数组对象完全相同的去除
function delObj(obj) {
var uniques = [];
var stringify = {};
for (var i = 0; i < obj.length; i++) {
var keys = Object.keys(obj[i]);
keys.sort(function(a, b) {
return (Number(a) - Number(b));
});
var str = '';
for (var j = 0; j < keys.length; j++) {
str += JSON.stringify(keys[j]);
str += JSON.stringify(obj[i][keys[j]]);
}
if (!stringify.hasOwnProperty(str)) {
uniques.push(obj[i]);
stringify[str] = true;
}
}
uniques = uniques;
return uniques;
}
var arr = [
{name:'uzi',color:'blue'},
{name:'pdd',color:'white'},
{name:'mlxg',color:'orange'},
{name:'uzi',color:'blue'},
]
console.log('arr：',delObj(arr))
var arr1 = [
{name:'uzi',color:'blue'},
{name:'pdd',color:'white'},
{name:'mlxg',color:'orange'},
{name:'uzi',color:'red'},
]
console.log('arr1：',delObj(arr1))
HTML
var user_id = sessionStorage.id;
var token = sessionStorage.token
<div class="flag_show" style="width: 100%;text-align: center;height: auto;display: none;">~没有更多数据~</div>
if ($(‘input[name=findtext]’).val() == ‘’) {
getOrder()
}
//input动态设置值
$(“input[name=‘c_contact_name’]”).attr(“value”, data[0].user_name);
工程进行中
state = $(this).data('status');
//获得页面跳转传递的参数
var id = GetRequest().id
//获取地址栏的url参数
function GetRequest() {
var url = location.search; //获取url中"?“符后的字串
console.log(‘url===’+url)
var theRequest = new Object();
if (url.indexOf(”?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
}
}
return theRequest;
}
res.data.forEach(function (item, index) {
//ES6新语法：模板字符串
html +=
<option value="${item.company_name}">${item.company_name}</option>;
})
$(’.conpany’).html(html);
//新增模板
$newbox = $(
‘
’);
(
′
.
b
l
i
s
t
′
)
.
p
r
e
p
e
n
d
(
('.b_list').prepend(
(′.bl?ist′).prepend(newbox);//在选中标签开始的地方插入内容
(
′
.
b
l
i
s
t
′
)
.
a
p
p
e
n
d
(
('.b_list').append(
(′.bl?ist′).append(newbox);//在选中目标的结尾插入内容
(
′
.
b
l
i
s
t
′
)
.
a
f
t
e
r
(
('.b_list').after(
(′.bl?ist′).after(newbox);//在被选元素之后插入内容
(
′
.
b
l
i
s
t
′
)
.
b
e
f
o
r
e
(
('.b_list').before(
(′.bl?ist′).before(newbox);//在被选标签前面插入内容
$(’.onway’).click(function() {
state = $(this).data(‘status’);
console.log(state);
order(state);
})
// 已完成
$(’.finish’).click(function() {
state = $(this).data(‘status’);
console.log(state);
order(state);
})
$.getJSON(‘http://aef.yunfangshi.com/api/600bddfc4b0ef’, { user_id: user_id, token_id: token }, function(res) {
console.log(‘业务员端===’+JSON.stringify(res));
if (res.code == 1) {
} else {
layer.msg(res.msg);
}
})
//动态设置select默认选中的option
$(’.bizhong’).val(‘4’)
//jq设置页面加载完成事件
$(function () {
getOrder()
})
返回上一步
window.history.back(-1);
window.history.go(-1);//返回上一页不刷新
window.history.back(); //返回上一页
window.location.href = document.referrer;//返回上一页并刷新，真正实现页面后退并刷新页面
history.go(1);//前进一页
history.forward(); //前进一页
history.length;//用length属性查看历史中的页面数
history.go(-1)和history.back()的区别
1.history.go(-1)表示后退与刷新。如数据有改变也随之改变
2.history.back()只是单纯的返回到上一页。
//页面跳转
location.href = “index.html”
var sex = $(‘input[name=user_sex]’).val();
$(‘input[name=user_phone]’).val(res.data.user_phone)
$(“input[name=‘b_actual_price’]”).attr(“value”, data.b_actual_price);
添加
//js实现移动HTML5页面滑动到最底部触发内容加载
//文档高度
function getDocumentTop() {
var
scrollTop = 0,
bodyScrollTop = 0,
documentScrollTop = 0;
if (document.body) {
bodyScrollTop = document.body.scrollTop;
}
if (document.documentElement) {
documentScrollTop = document.documentElement.scrollTop;
}
scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
return scrollTop;
}
//可视窗口高度
function getWindowHeight() {
var windowHeight = 0;
if (document.compatMode == “CSS1Compat”) {
windowHeight = document.documentElement.clientHeight;
} else {
windowHeight = document.body.clientHeight;
}
return windowHeight;
}
//滚动条滚动高度
function getScrollHeight() {
var
scrollHeight = 0,
bodyScrollHeight = 0,
documentScrollHeight = 0;
if (document.body) {
bodyScrollHeight = document.body.scrollHeight;
}
if (document.documentElement) {
documentScrollHeight = document.documentElement.scrollHeight;
}
scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
return scrollHeight;
}
window.onscroll = function () {
//监听事件内容
if (getScrollHeight() == getWindowHeight() + getDocumentTop()) {
//当滚动条到底时,这里是触发内容,异步请求数据,局部刷新dom
console.log(“开始滚动！”);
}
}
function scroll() {
//文档高度
var
scrollTop = 0,
bodyScrollTop = 0,
documentScrollTop = 0;
if (document.body) {
bodyScrollTop = document.body.scrollTop;
}
if (document.documentElement) {
documentScrollTop = document.documentElement.scrollTop;
}
scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
//可视窗口高度
var windowHeight = 0;
if (document.compatMode == “CSS1Compat”) {
windowHeight = document.documentElement.clientHeight;
} else {
windowHeight = document.body.clientHeight;
}
//滚动条滚动高度
var
scrollHeight = 0,
bodyScrollHeight = 0,
documentScrollHeight = 0;
if (document.body) {
bodyScrollHeight = document.body.scrollHeight;
}
if (document.documentElement) {
documentScrollHeight = document.documentElement.scrollHeight;
}
scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
if (scrollHeight == windowHeight + scrollTop) {
//当滚动条到底时,这里是触发内容,异步请求数据,局部刷新dom
// console.log("开始滚动！");
return true
}
return false
}
window.onscroll = function () {
//监听事件内容
if (scroll()) {
//当滚动条到底时,这里是触发内容,异步请求数据,局部刷新dom
console.log(“开始滚动！”);
}
}
if (res.code == 404) {
location.href = ‘…/login.html?status=1’
} else
function formatDate(value) {
let date = new Date(value)
let y = date.getFullYear()
let m = date.getMonth() + 1
let d = date.getDate()
y = y < 10 ? (‘0’ + y) : y
m = m < 10 ? (‘0’ + m) : m
d = d < 10 ? (‘0’ + d) : d
return y + ‘.’ + m + ‘.’ + d
}
var list=res.data
for(var i in list){
list[i].add_time=formatDate((list[i].add_time)*1000)
}
//手机端web页面自适应 /* 手机端 */ @media screen and (max-width:768px) { html { /* 相当于100px */ background-color: #f1f1f1; font-size: 13.33333vw; } }
//手机web长按触发事件
var timeOutEvent = 0;
function touchstart(obj) {
timeOutEvent = setTimeout(function () {
//此处为长按事件-----在此显示遮罩层及删除按钮
console.log(“长按事件触发发” );
}, 500);
}
function touchend() {
clearTimeout(timeOutEvent);
}
//打印26个字母
for(let code =65;code<91;code++){
console.log(String.fromCharCode(code))
}
ES6
//ES6复制数组//合并数组concat()和rest
//复制数组
(方法一:)
var arr1=[‘a’,‘b’,‘c’,‘d’];
var cc=arr1.concat();
cc[1]=‘yy’;
console.log(arr1);//[“a”, “b”, “c”, “d”]
console.log(cc);//[“a”, “yy”, “c”, “d”]
(方法二:)
var arr1=[‘a’,‘b’,‘c’,‘d’];
var dd=[…arr1];
dd[0]=‘es6’;
console.log(dd);//[“es6”, “b”, “c”, “d”]
console.log(arr1);//[“a”, “b”, “c”, “d”]
//合并数组
(方法一:)
var arr1=[‘a’,‘b’,‘c’,‘d’];
var arr2=[‘d’];
var arr3=[‘e’,‘f’];
var cc=arr1.concat(arr2,arr3);
console.log(cc);//[“a”, “b”, “c”, “d”, “d”, “e”, “f”]
(方法二:)
var arr1=[‘a’,‘b’,‘c’,‘d’];
var arr2=[‘d’];
var arr3=[‘e’,‘f’];
var dd=[…arr1,…arr2,…arr3];
console.log(dd);//[“a”, “b”, “c”, “d”, “d”, “e”, “f”]
//ES6：map映射数组映射
1、将一个普通数组映射为对象数组
将[1,2,3] 映射为 [{id: 1}, {id: 2}, {id: 3}]
var arr=[1,2,3];
arr=arr.map(item=> { // item是数组中的每一个值
return {id:item}
})
console.log(arr); //[{id: 1}, {id: 2}, {id: 3}]
3.将一个对象数组映射为另一个对象数组
attachmentList是一个对象数组，需要其中的属性转换为另外一个对象数组fileList，如下：
this.fileList = this.attachmentList.map(item=>{
return {id:item.id,name:item.fileName,url:item.filePath}
});
…/assets/
<el-pagination
layout=“prev, pager, next”
:total=“count”
@current-change=“current_change”
@prev-click=“prev_click”
@next-click=“next_click”
>
count:0,
this.count=Number(data.data)
current_change(val){
},
prev_click(val){
},
next_click(val){
},
//Android的签名文件生成
1.通过这段命令直接进入jdk bin文件夹下面 cd C:\Program Files\Java\jdk1.8.0_91\bin
2.再输入keytool命令行
keytool -genkey -alias android.keystore -keyalg RSA -validity 20000 -keystore android.keystore
|