tips
女青年大新
这个作者很懒,什么都没留下…
展开
-
微信jsapi支付详解
JSBridge,一个js桥帮助H5和Native之间的通信,因为js是运行在一个js容器里,与原生运行环境隔离,所以需要这种机制来实现这两个的双向通信。第二步:获取到微信支付弹窗的参数:如appId,时间戳,随机窜,微信签名方式,微信签名。前提配置:公众号要设置好支付域名,网页授权域名,企业账号,商户号,开通jsapi支付权限。首先:需要先判断环境,如果不是微信环境下就切换成H5浏览器环境下支付。第一步:我这边是要通过微信code发送请求给后端获取唤起微信弹窗参数。第三步:唤起支付弹窗。原创 2023-02-27 15:43:46 · 2598 阅读 · 0 评论 -
jsonp请求
前端原创 2022-11-04 15:59:21 · 139 阅读 · 0 评论 -
H5微信jsapi支付流程
微信H5支付原创 2022-07-11 16:33:15 · 349 阅读 · 0 评论 -
vue-video-player使用及修改样式
首先下载并引入(main.js引入):import VideoPlayer from 'vue-video-player';require('video.js/dist/video-js.css');require('vue-video-player/src/custom-theme.css');const hls = require('videojs-contrib-hls')Vue.use(VideoPlayer)Vue.use(hls)使用: <div class="原创 2022-03-10 11:38:30 · 4855 阅读 · 0 评论 -
本地图片上传前预览(转64位),64位图片转成二进制流
本地图片上传前预览(转64位)html部分 <!-- 预览的图 --> <img :src="preview" class="preview" crossorigin="anonymous" v-if="preview" alt="" /> <input @change="imageUploadClick" type="file" apt原创 2022-02-11 09:43:27 · 687 阅读 · 0 评论 -
使用nvm在windows下管理不同项目的node版本
1、在下载安装前 将电脑原本的node版本和文件夹都删掉。2、下载安装插件nvm-setup.zip,双击nvm-setup.exe,选择好安装路径。3、设置环境变量windows+R,输入sysdm.cpl确定,选择高级-->>环境变量,如果nvm文件夹里没有nodejs文件夹就新建一个同名文件夹(注意里面一定要是空的)。4、cmd打开命令行 输入nvm list available查看可以安装的node版本,输入nvm inst原创 2021-12-31 15:57:10 · 650 阅读 · 0 评论 -
子组件使用watch监听父组件数据的变化也随之变化
1.父子之间的通信我们通过props传递信息,但是父组件的数据会随时变化,子组件也要跟随变化。使用watch监听父组件传递过来的值。父组件中(search为子组件):<template> <img src="../assests/search.png" alt="" @click="getSearch()" /><input type="text" v-model="searchText" plac原创 2021-12-10 15:03:06 · 3601 阅读 · 0 评论 -
uni-app的swiper组件设置overflow: hidden不生效
问题:在小程序里使用swiper组件制作轮播图,给父元素设置了固定宽高,样式圆角border-radius,定位position: relative,超出隐藏overflow: hidden,在安卓机正常显示,但是在ios上圆角不能显示,原因是这个超出隐藏没有生效,所以需要在父元素在添加这四行代码。backface-visibility: hidden; transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -原创 2021-11-25 11:44:05 · 1274 阅读 · 0 评论 -
小程序video组件的自定义全屏/兼容安卓机的黑边填满容器/video全屏时自定义按钮被覆盖
1.自定义全屏按钮被覆盖按钮标签必须在video组件里全屏的时候才能显示出来,2.在安卓机里视频有黑边 首先需要在video标签写入 x5-video-player-type="h5" object-fit='cover'style="width= 100%; height=100%"这样在安卓机里就不会有黑边了3.自定义全屏事件(在真机调试或者预览时会有问题但是!!!打包发布测试服后是正常的) <video id="myvideo" :c...原创 2021-11-23 17:22:29 · 3323 阅读 · 0 评论 -
uni-app中 控制onLaunch和onLoad的异步请求先后顺序
小程序一般都需要在app.vue的onLaunch做一个异步请求获取用户的openId和token之后才能执行页面的onLoad里的异步请求,像平常用async await控制异步请求的先后顺序,在小程序里也一样,只不是需要做成全局的。如 :在main.js里挂载Vue.prototype.$getToken = new Promise(resolve => { Vue.prototype.$isResolve = resolve;})然后在app.vue中onLaunc原创 2021-11-08 15:55:36 · 1463 阅读 · 2 评论 -
uni-app封装小程序wx.request,然后挂载到全局
首先 在src目录下创建一个request/request.js,内容如下let baseURL = "https://dfft.dsnddvideo.cn/wogds"export const http = (options) =>{ return new Promise((resolve,reject) => { wx.request({ url: baseURL+options.url, method:options.method || 'ge原创 2021-11-08 15:43:14 · 648 阅读 · 1 评论 -
vue九宫格封装好的组件 样式可以自由改哦
二话不说贴代码 反正我写的很简单!!! 在子组件里<template> <div class="main_container box"> <div class="turntable_box"> <ul id="rotary_table"> <li v-for="(item, index) in dataNum" :key="index" :cla..原创 2021-11-03 15:31:39 · 283 阅读 · 0 评论 -
VUE抽奖大转盘制作
人一闲就无聊 想做点小东西 以后需要的时候拎起来就用嘿嘿嘿 我做的转盘简单没啥难度,样式也是随便整整,里面的图片都是远程的<template> <div class="turntable"> <!-- 转盘组件 --> <div class="box"> <div class="rotateBg" :style="{ transform: rotate_deg, transi.原创 2021-11-03 15:23:41 · 776 阅读 · 0 评论 -
uni-app小程序顶部导航自定义适配机型
主要要算navHeight(整个导航栏总的高度),statusHeight(状态栏高度),topHeight(胶囊距离顶部的距离);在app.vue中计算globalData: { //全局变量 getApp().globalData.navHeight调用读取 navHeight: 0, //整个导航栏总的高度 statusHeight: 0, //状态栏高度(手机电量WiFi) topHeight: 0, //胶囊距离顶部的距离 },...原创 2021-11-03 15:05:34 · 430 阅读 · 0 评论 -
uni-app自定义底部tabBar导航适配机型
1.首先需要在page.json里把"tabBar": { "custom": true}2.然后就是组件封装 props的selectIndex用来确定哪一个按钮是选中的状态<template> <div class="tabbar"> <ul> <li v-for="(item, index) in pageData" :key="index" @click="goPage(item.pagePath)...原创 2021-11-02 11:51:33 · 506 阅读 · 0 评论 -
vue自动获取input下一个光标,复制粘贴自动切割
1.功能描述: 有四个input输入框,在一个input输入框中输满四个字符就自动聚焦到下一个input,复制粘贴类似于兑换码的 这种16位的ZPER-21UJ-PXPK-2Y13,粘贴后按照'-'切割自动分配到不同的input框中。2.代码部分://HTML部分<div class="box-flex"> <div class="p"> <input v-model="code_1" v-on:in原创 2021-10-27 10:09:06 · 374 阅读 · 0 评论 -
vue制作滑动拼图(主要是用js修改sass里的变量和vue中的event事件对象)
1.在vue中要获取event事件对象 在绑定事件时要利用$event作为参数传递。<template> <div id="imgBox"> <!-- 碎片 --> <div id="slidImg"> <img src="https://5-2ebf-4838-9ece-bde9690e8134.png" alt=""> </div> <!-- 大图 --> ...原创 2021-10-08 14:45:37 · 252 阅读 · 0 评论 -
vue异步修改数据 视图未变化
前几天遇到个小问题,H5页面在小程序里数据刷新了但是视图层没变化,这个问题iOS上表现正常,在安卓机上就不行,最新的值能拿到但是视图层不能刷新,于是我决定换一种写法。axios请求数据成功后立马给this.limitNumber赋新值,computed监听他的变化<p ref="limmit">{{ numView }}</p>js部分的 computed: { numView: function () { if (this.limitNumber !=原创 2021-08-13 15:08:04 · 263 阅读 · 1 评论