- 博客(27)
- 收藏
- 关注
原创 van-field实现自定义图标
1.在在阿里巴巴图标库https://www.iconfont.cn/中找到需要的icon加购物车。代码中class-prefix的值和name的值拼接起来要和下图中的class名一致。3.把以下四个文件放到assets中。2.在购物车中下载代码。
2023-03-24 16:26:25
1954
原创 vue项目打包成.exe桌面应用
整理一下本人实现vue项目打包成桌面应用的流程一、新建文件夹,使用git下载# giteegit clone https://gitee.com/wallace5303/electron-egg.git# githubgit clone https://github.com/wallace5303/electron-egg.git二、进入到electron-eggcd electron-egg-> npm install三、把你的项目打包成dist文件,生成的dist文件把 el
2022-05-30 15:06:28
1634
6
原创 百度地图使用笔记
<div id="content1"></div>var map = new BMap.Map('content1'); // 创建Map实例添加点标注var location = new BMap.Icon(require("@A/images/location.png"), new BMap.Size(46, 36)); // 自定义图标var point = new BMap.Point(aObj.bd_lng, aObj.bd_lat)var marker
2021-08-10 17:48:14
308
原创 vue设置每个页面title
在main.js里添加一下代码:Vue.directive('wechat-title', { inserted: function (el,binding) { document.title = binding.value }})路由中添加metaroutes: [ { path: '/', name: 'Home', component: Home, meta:{ title:'在这里设置标题'
2021-06-11 11:23:43
140
原创 jq插件实现简单分页
pagination.js文件(function($){ $.fn.pagination = function(options){ var args = $.extend({ pageCount: 15, // 总页数 currentPage:1, // 当前页 backFn:function(){} },options); ms.init(this,args,options); }; var ms = { init:function(obj,a
2021-04-14 16:28:05
251
原创 正则验证密码规则
密码设置<input type="password" v-model="password" />var patrn=/(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9]).{8,}/;if (!patrn.exec(password)){ console.log('密码应由数字及大小写字母组成')}else{ }exec() 方法用于检索字符串中的正则表达式的匹配。...
2021-03-15 16:33:26
252
原创 日历
待完善…<template> <div class="container"> <div class="top"> <span @click="preMonth"><</span> <span class="year">{{year}}年{{month}}月</span> <span @click="nextMonth">></span> &l
2021-03-11 10:57:29
124
原创 vue中动态拼接的html中点击方法触发
let infoWindow = “<div onClick = 'goDetail()'>查看详情</div>”methods:{ goDetail(){ console.log('xiangqing') },}连接两者:created(){ let _this = this window.goDetail=_this.goDetail;},
2021-03-11 10:12:50
554
3
原创 vue中只在页面循环显示列表中的一部分数据
开始是这样写的,但是v-if和v-for不可以同时使用,v-for的优先级更高,会遍历列表中所有数据,降低性能// 不建议使用这种方法<li class="li li1" v-for="(item,index) in searchList" :key="index" v-if="index >6"></li>使用计算属性处理需要的列表<li class="li li1" v-for="(item,index) in secondList1" :key="ind
2020-12-17 17:39:07
4983
原创 echarts图表字体自适应
以设计图宽度为1920px为例// 写在了公共方法,也可直接写在页面方法中export default{ fontSize(res){ let docEl = document.documentElement, clientWidth = window.innerWidth||docEl .clientWidth||document.body.clientWidth; if (!clientWidth) return; let fontSize = 10 * (clientW
2020-12-16 15:34:06
447
原创 js中的this指向
函数的this指向 看调用、不看声明一、普通函数调用①函数名() this->windownfunction fun(){ console.log(this) //window} fun() //相当于window.fun()二、事件处理函数调用oDiv.onclick = function(){} this->添加事件的元素对象的方法 ,对象.方法调用this 指向该对象let obj={ name:'丢丢', age:"18", spe
2020-11-13 11:08:01
185
1
原创 路由钩子
1.全局路由钩子beforeEach,afterEach的用法每次切换路由都会触发全局的钩子函数,写在router.js文件中router.beforeEach() 进入之前触发router.afterEach() 进入之后触发const router = new Router({ routes:[{ path: '/dashboard', name: 'dashboard', component: () => import( /* webpackChunkName: "
2020-11-04 09:55:42
381
3
原创 伪元素清除浮动的方法
一、给父元素加伪元素after或before<ul> <li>1</li> <li>2</li> <li>3</li></ul><style> ul::after{ content:'', display:'block', clear:'both' } li{ float:left; }</style>二、父元素overflow设置成hidden或者a
2020-11-02 17:43:12
342
原创 vue中的竖向滚动条实现方法
<template> <view> <view class="search-input-box"> <view class="search-scroll" :class="{aniamtedTop}"> <view class="search-list" v-for="(item,index) in searchList"> {{item.content}} </view> </view
2020-08-18 17:12:10
4159
2
原创 对vuex的理解
新建一个store.js文件import vue from 'vue'import Vuex from 'vuex'vue.use(Vuex)let defaultCity = '北京'defaultCity = localStorage.city export default new Vuex.Store({ state:{ cityName: defaultCity }, mutations:{ changeCity(
2020-08-12 09:28:15
105
1
转载 小程序圆形进度条组件
circle.jsComponent({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, properties: { draw: {//画板元素名称id type: String, value: 'draw' }, per:{ //百分比 通过此值转换成step type: String, value: '', observer: fun
2020-08-07 15:54:15
678
原创 小程序中onlooad和组件执行顺序导致组件无法获取到动态数据
页面的onLoad执行是在所有组件初始化完成之后的。所以就会出现动态数据父传子时页面无法正常加载下面是使用圆形进度条时遇到的问题:页面使用:<view class="circle"> <circle draw='circwewle1' per = '{{pre}}' r = '80'/> </view>pre是进度百分比1-100 需要根据动态获取的数据赋值页面js:data: { pre:''},onLoad: function (op
2020-08-07 15:34:32
360
原创 vue使用filter过滤器优化价格格式
filter中的jsmoneyFilter.js:export function toMoney(money){ if(money){ money = money.toFixed(2) }else{ money = 0; money = money.toFixed(2) } return money;}vue文件使用:// template:<p>¥{{price | moneyfilter}}</p>// script: import {toM
2020-08-04 13:49:22
592
1
原创 props传值时无法在mounted处理的解决方法
遇到的问题:父组件传值,在子组件中不能用mounted处理export default{ props:['floor1'], data(){ return { floor1_0:'', floor1_1:'', floor1_2:'', } }, mounted(){ console.log(this.floor1) //打印出的不是所传的值 this.floor1_0 = this.floor1[0]; }}因为pr
2020-07-29 16:46:38
2469
原创 小程序组件传值,绑定组件的方法
创建组件Component({ options: { multipleSlots: true // 在组件定义时的选项中启用多slot支持 }, properties: { articleTitle: String, //文章标题 counts: { //浏览次数 type:Number, value:0 }, }, data:{}, // 私有数据,可用于模板渲染
2020-07-28 17:24:22
511
原创 获取手机验证码倒计时
wxml<view class="phoneContainer"> <input type="number" maxlength="11" disabled="{{disabled}}" placeholder="手机号" value="{{phoneNumber}}" class="phoneNumber" bindinput="getPhone"/></view><view class="codeContainer"> <input t
2020-07-24 22:14:24
145
原创 小程序获取input中的值
wxml中:<input class='inp' bindinput='getName' value='{{name}}' />js中:data: { name:''},getName(e){ this.setData({ name: e.detail.value })},
2020-07-14 17:13:57
356
原创 vue中computed、watch和methods的区别和用法
vue中computed、watch和methods的区别和用法computed和watch
2020-07-14 15:24:51
578
原创 小程序登录,前端获取openid
小程序登录,前端获取openid获取code获取openid获取基本信息获取codewx.login({ success(res) { } })使用wx.login()获取到用户临时登录凭证获取openidwx.request({ url: 'https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_t
2020-07-13 14:26:54
724
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人