MrLi-2018-优快云博客

效果图一、下载依赖npm install element-plus --save二、引入方式import ElementPlus from "element-plus"import 'element-plus/dist/index.css'createApp(App).use(store).use(router).use(ElementPlus).mount("#app");完美解决报错...

2022-05-30 10:46:40 3491

原创 vue3 运行项目报错 error and 0 warnings potentially fixable with the `--fix` option.

找到.eslintrc.js 的plugin:prettier/recommended注释掉重新跑项目就可以正常运行了

2022-05-30 10:37:57 670

原创 css 点击穿透 pointer-events: none；一般用于遮罩

通常我们用遮罩后会覆盖到一些需要点击的事件例如：<div class="demo" click="aaa">111</div><div class="mask"></div><style> .mask{ width:100%; height:100vh; background-color:rgba(0,0,0,.5); p

2022-04-01 16:50:48 7674

原创 Echarts 环形图多层嵌套

效果图：代码：<!DOCTYPE html><html style="height: 100%"> <head> <meta charset="utf-8"> </head&g.

2022-04-01 16:37:49 1476

原创 Echarts 自定义背景图，环状图中心添加图片

先看效果图：代码：<!DOCTYPE html><html style="height: 100%"> <head> <meta charset="utf-8"> </hea

2022-04-01 16:31:34 3352 1

1、wxml<button bindtap="openMusic"></button>2、js openMusic:function(e){ const innerAudioContext = wx.createInnerAudioContext() innerAudioContext.autoplay = true innerAudioContext.src = 'http://m10.music.126.net/202109.

2021-09-24 16:50:05 1957

原创小程序组件中获取指定元素报错怎么办

例如获取id为box的元素信息 wx.createSelectorQuery().selectAll('#box').boundingClientRect(function (res) { console.log(res)//小程序组建中不会返回#box元素的信息 }).exec()修改为即可 const $ = wx.createSelectorQuery().in(this) $.selectAll('.scroll-number').boundingClientRect

2021-09-16 14:23:17 2399

转载小程序数字滚动效果

效果图wxml<view class="scroll-number container-class"> <block wx:for="{{valArr}}" wx:key="index"> <view wx:if="{{item.isNaN}}" class="scroll-number-item number-dot dot-class">{{item.val}}</view> <view wx:else cl..

2021-09-15 12:25:39 553

原创小程序滚动条滚动到指定位置

wxml<scroll-view style="height:100vh" class='scroll' scroll-y='true' scroll-top="{{scrollTop}}px"> <view style="height:1000rpx"> <view>111</view> <view>111</view> <view>111</view

2021-09-10 17:20:55 725

原创 angular12子父组件传值

1、父传子父组件<div> <ty-forme [item] = "currentItem"></ty-forme></div> export class HomeComponent implements OnInit { currentItem = "来自父组件"; }子组件<div> 父组件传来的值: {{item}}</div>import { Component,.

2021-09-02 14:43:03 389

原创 angular 12+NG-ZORRO -UI中使用Modal对话框时注意

当时我的代码是这样写的<div class="pages"> <button nz-button nzType="primary" class="addBtn">新建渠道</button> <div class="tableBox"> <nz-table #basicTable [nzData]="listOfData"> <thead> <

2021-08-05 17:20:00 3565

原创小程序点击选择页码分页（上篇优化）

先看效果wxml<view class="container"> <view class="pages_box"> <view bindtap="pagesFn" data-type="start">第1页</view> <view wx:if="{{frontPage}}" bindtap="pagesFn" data-type="previous_page">＜</view> <block..

2021-07-31 15:58:33 766

原创小程序筛子抽奖

<view class="container"> <view class="shaizi_box {{activeTrue}}" style="transform: rotateX({{rotateX}}deg) rotateY({{rotateY}}deg) rotateZ({{rotateZ}}deg);"> <view class="shaizi">1</view>.

2021-05-24 16:14:24 194

原创小程序获取当前位置信息

首先app.json添加 "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } },调用小程序获取位置坐标信息的方法 wx.getLocation({ type: 'wgs84', success (res) { const latitude = res.latitude const longitude = r

2021-05-17 09:39:04 750

原创小程序根据坐标获取位置信息使用百度api报错 app服务被禁用的解决方法

将请求地址https://api.map.baidu.com/geocoder/v2/换成https://api.map.baidu.com/reverse_geocoding/v3/如果还是不行的话在百度地图开放平台里面重新创建一个应用使用新的AK就ok了

2021-05-15 18:05:25 2260

原创小程序使用echarts 踩坑大全 tooltip v-if隐藏图表错位滑动图表不跟随等

1、小程序不支持tooltip解决方法 tooltip: { trigger: 'axis', animation: false, axisPointer: { type: 'cross', crossStyle: { color: 'red' } }, formatter: function(params) { .

2021-05-07 12:06:27 862 2

原创小程序分页

<view class="pages_box"> <view bindtap="pagesFn" class="{{pagesNum==0?'active':''}}" data-type="0">上一页</view> <block wx:for="shujuDataArr11111" wx:key="index" wx:if="{{index+1<4}}"> <view wx:if="{{tyindex+index <...

2021-04-30 11:44:46 255

原创小程序中动效进度条

<view class="ottery_bottom_jdt_win"> <view class="ottery_bottom_jdt_box"> <view class="jdt" style="width:80%"></view> <view class="number">80%</view> </view> <view cla..

2021-03-22 14:45:44 300

原创小程序页面中调用js方法

<wxs module="function"> module.exports = { isSplit:function(n){ return n.split(" ") } }</wxs> <text class="time1">{{function.isSplit(item.time)[1]}}</text>

2021-03-08 16:01:17 964

原创小程序for循环限制数量的方法

2021-03-08 15:50:53 1329

原创小程序弹幕

不废话直接上干货<view class="dan_box"> <block wx:for="{{danData}}" wx:key="id"> <view class="dan_con" style="animation: shift {{item.time}}s linear forwards;top:{{item.top}}%"> <image src="{{item.touxiang}}"></image.

2021-02-07 16:51:52 634

原创微信小程序推广多多进宝商品，微信小程序跳转拼多多小程序领券页面，微信小程序跳转多多进宝推广链接

先申请账号流程就不说了然后设置推广位找到推广位id多多进宝推广商品页https://jinbao.pinduoduo.com/promotion/single-promotion随便选个商品点击推广点击确定选择长链接复制出goods_id进入拼多多开放平台https://open.pinduoduo.com/application/app/detail拿到client_id和client_secret对应的值打开这个网址https...

2021-02-06 17:15:58 7486 10

原创 vue 获取指定元素

在想要获取元素上添加“ref” ref="scroll"scroll为函数名<div ref="scroll">vue获取指定元素</div> xiaFn:function(){ console.log(this.$refs.scroll) }

2021-02-03 10:34:39 1490

原创 js 监听Dom元素的内部的（元素，数据）等内容的变化

监听#p-avatar30元素下新增元素事件$("#p-avatar30").bind('DOMNodeInserted',function(e){ console.log('已新增内容'+$(e.target).html())});监听#p-avatar30元素里移除元素的事件$("#p-avatar30").bind('DOMNodeRemoved', function(e) {　　 console.log('已移除内容'+$(e.target).html()...

2021-01-20 09:27:42 1381

原创小程序自定义位置坐标调用本机地图打开导航

1.小程序自定义位置坐标调用本机地图打开导航wxml部分 <text class="map_btn" bindtap="openMap" data-latitude='{{latitude}}' data-longitude='{{longitude}}' data-addressName='{{addmissage}}'>地图/导航</text>js部分Page({ /** * 页面的初始数据 */ data: { addmiss

2020-11-14 15:28:18 368

转载小程序文字太长显示不完，滚动文字效果

效果图1、解决思路：一共两个text控件，当第一个text滚动完后应该是看到第二个text控件了，但是在这个时候最好的方法不是让它滚完，而是用重新又从第一个text控件开始滚动，控制起来超级简单，基本实现了跑马灯的效果，另外加了一个如果文字不足一屏，不执行跑马灯的效果，而且添加了超大的间距，解决不会显示重复内容。以下是各部分完整代码，只要复制代码添加到相应页面即可看到效果。2、小程序布局页面wxml<scroll-view class="container" enable-f..

2020-11-03 11:09:18 4129 5

原创小程序跳转公众号关注页面的两种方法

一、web-view方法这个种方法有一个必须要达到的条件就是：小程序的公众号必须是认证的企业号，而且要在小程序公众号的后台添加“veb-view业务域名”！不然会出现如下情况<view class="ty_box"> <web-view src="{{url}}">小程序跳转公众号</web-view></view>// pages/webview6

2020-10-20 17:42:53 18246 15

原创织梦列表页调用新增图片字段，用field调用前端显示的不是纯图片路径，含有li、a等前端标签的解决办法

<li> <a href=' http://xin.lingyanghuodong.com/uploads/200924/1-200924102G6157.png' target='_blank'><img src=' http://xin.lingyanghuodong.com/uploads/200924/1-200924102G6157.png' width='651' border='0'/></a> ...

2020-09-27 09:56:15 281

原创 mui 手机端链接跳转打开新窗口方法

<a href="javascript:;" dada-url='index.html' class="aaa">mui('body').off('tap' , '.aaa').on( 'tap' , '.aaa' , function(){ let url = $(this).attr("dada-url"); window.open(url,"_blank");});

2020-09-07 09:40:47 724

强制用ie浏览器打开链接

空空如也