web前端开发乱七八糟的奇怪操作

原创已于 2022-09-22 14:24:34 修改 · 319 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java #javascript #前端

于 2022-08-04 17:49:32 首次发布

vue 同时被 3 个专栏收录

34 篇文章

订阅专栏

小程序

26 篇文章

订阅专栏

8 篇文章

订阅专栏

vue2 初始化data数据 Object.assign(this.$data, this.$options.data.call(this))

https://github.com/qx344265690/drag

vue.draggable的clone拷贝实现常用菜单功能 - itxst.com

https://github.com/SortableJS/Vue.Draggable

做蒙版阴影中间扣个洞

css{

position: absolute;

  top: 520rpx;

  left: 25rpx;

  background: transparent;

  width: 700rpx;

  height: 1100rpx;

  border-radius: 20px;

  box-shadow: rgba(0,0,0, 0.4) 0 0 0vw 100vh

}

H5 仅在微信客户端打开链接电脑可访问

var useragent = navigator.userAgent;

if(useragent.match(/WindowsWechat/) == 'WindowsWechat' || useragent.match(/MicroMessenger/i) != 'MicroMessenger') {

    // 这里警告框会阻塞当前页面继续加载

    window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=888"

    //alert('已禁止本次访问：您必须使用微信内置浏览器访问本页面！');   

}

H5 仅在微信客户端打开链接电脑不可访问只能在手机微信端访问

var useragent = navigator.userAgent;

if(useragent.match(/WindowsWechat/) == 'WindowsWechat' || useragent.match(/MicroMessenger/i) != 'MicroMessenger') {

    // 这里警告框会阻塞当前页面继续加载

    //alert('已禁止本次访问：您必须使用微信内置浏览器访问本页面！');

    document.head.innerHTML = '<title>抱歉，出错了</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/open/libs/weui/0.4.1/weui.css">';

    document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title">请在微信客户端打开链接</h4></div></div>';

}

小程序调起客服文档（button | 微信开放文档）

session-from 后端可通过微信API回调接收到此数据

<button open-type="contact"
        session-from="money"
        send-message-title="牛豆充值"
        send-message-path="pages/index/index"
        show-message-card="{{true}}"
    	send-message-img="logo.img"
></button>

H5开发设置REM

(function(doc, win) {
    var docEl = doc.documentElement,
        resizeEvt = "orientationchange" in window ? "orientationchange" : "resize",
        recalc = function() {
            if (docEl.clientWidth > 750) {
                docEl.style.fontSize = "100px";
                doc.getElementById("app").style.width = "750px";
            } else {
                var width = docEl.clientWidth / 7.5;
                docEl.style.fontSize = width + "px";
                // doc.getElementById("app").style.width = "auto";
            }
        };
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener("DOMContentLoaded", recalc, false);
})(document, window);

获取URL 带的参数

let url = www.baidu.com?id=1

let id = getQueryVariable('id')

getQueryVariable(variable){
   var query = window.location.search.substring(1);
   var vars = query.split("&");
   for (var i=0;i<vars.length;i++) {
       var pair = vars[i].split("=");
       if(pair[0] == variable){return pair[1];}
   }
   return(false);
}

返回上一级页面并带回参数数据


let pages = getCurrentPages()//当前页面
    let prevPage = pages[pages.length - 2]//上一页面
    prevPage.setData({
//直接给上一个页面赋值
      address: e.currentTarget.dataset.item
    });
    wx.navigateBack({
      delta: 1
    });