weixin_45121510的博客

父组件<template> <section> <div class="ruleBtn" @click="handleClick($event)">点击按钮</div> <RuleModal v-if="ruleModalVisible" ref="ruleModal" :modalConfig="modalConfig" @close="closeRuleModal" /

在index.html中加上以下代码<script src="//cdn.jsdelivr.net/npm/eruda"></script><script >eruda.init();</script>

因为h5项目，需要将页面通过微信分享出去，用户可以在微信中通过链接点入查看页面，会出现一些字体大小改变的问题，所以：android 需要重写事件wxFont.js文件(function() { if ( typeof WeixinJSBridge == 'object' && typeof WeixinJSBridge.invoke == 'function' ) { handleFontSize(); } else { if (docume

<div class="qrcodeCanvas"> <div id="qrcode" v-loading="expireLoading"></div> <div class="markQr" v-if="expireSign" @click="getCode"> <i class="iconfont icon-tuzhishuchu-xiazaichajianshuaxin"></i> </div&.

效果：实现页面字幕从屏幕外向上缓缓移动的动效，动效完成后，实现下部分固定，上部分（为了观察效果，特意用粉色框圈住部分）可滚动scroll的效果。效果一览：难点：主要是字幕动效完成后，将文字部分压缩在content中时：需要始终保持字幕部分最后一行字：【贺卡】，保持它在动画最后一幕那个位置不变动。知识：Element.scrollTopElement.clientHeightCSS3 过渡 transition代码：<template> <div class="h

踩坑1：在某些手机型号下：我说你说他说大家说有咩有问题就算是一个完整的span标签的内容，也会重叠在一起解决：加上letter-spacing属性：.text {letter-spacing: 2px;}letter-spacing 属性增加或减少字符间的空白（字符间距）踩坑2：在iphone6s真机上，保存图片到本地，出现：页面除背景外的其他部分为空白的情况。其他手机型号没有这种情况。出现原因：排查后发现：是由于页面主体部分有显隐动画，且直接把动画写在css里导致的问题。原代

子组件 ： loading文件：<template> <div class="nb-loading"> <div class="nb-loading-process"> <div class="process"> <img src="@/common/images/1-3@2x.png" /> <span>{{ process }}%</span>

<template> <div class="nb-header"> <div class="nb-music" v-show="hasMusic != 0" :style="'backgroundImage: url('+((isXinghaiApp)? bg:'')+')'"> <!-- audio标签 --> <audio ref="audioPlayer" style="opacity: 0;" loop

知识点：使用html2canvas实现移动端H5页面截图实现canvas图片转为文件阿里云文件上传功能.……<template> <div class="letter_box" id="shareContainer" :style="{ height: height ? height + 'px' : '100vh' }"> <!-- 头部logo --> <div class="header" v-show="isShowHeader

<template> <div class="nb-header"> <div class="nb-logo" :style="'backgroundImage: url('+logo+') '"></div> <div class="nb-music" @click="click"> <img :src="status ? music : musicStop" alt="" /> </di

官方文档：default-index 单列选择时，默认选中项的索引 number | string 0defaultIndex 这个属性只是一个初始值，如果需要动态改变 index索引：建议使用 picker 实例的 setIndexes 方法通过 ref 可以获取到 Picker 实例并调用实例方法，setIndexes 设置所有列选中值对应的索引 indexes -// 1.给van-picker设置ref，如ref="van_picker" <van-popup v.

<!-- 允许输入正整数，调起纯数字键盘 --><van-field v-model="digit" type="digit" label="整数" />有时设置了digit，但还是可以输入负数，可能是版本问题：vant文档申明：Tips: digit 类型从 2.4.2 版本开始支持这时我们可以和正则搭配使用：// 限制只能输入正整数'digit':function(v) { // 回填值是number类型的情况，做个判断 if(typeof v == 'nu

需求： h5表单页面，跳转到指定页面时，表单页面数据储存:1.采用keepAlive坑太多，数据偶尔丢失；2.可以使用vuex：将表单页面数据存入store，回来时再将所需数据取出。表单页面： // 路由离开的时候，判断跳转去的页面路由是否需要缓存 beforeRouteLeave(to, from, next) { if(to.name === "vote-application.vote.avatarPage") { let data = { formData.

在vue文件中使用<van-image>引用本地图片时，不能直接使用地址，应该在地址前面用require包上：:src=“require(url)”<van-image :src="require('@/common/imgs/more.png')" />

需求：进来查询接口，状态（3种：待投决，已投决，已结束），除了已结束状态都需要每3秒轮询一次，直到离开页面或者状态变为已结束才结束轮询created() { // 查询 this.query(this.id) },query(id) { joinDetail({id:id}).then(res =>{ if(res.status == true) { // 赋值…… this.item = res.body this.first

第一种：实现绿色list页面可滚动，tab页面固定<template><!-- 最外层div --> <div class="page page-test" style="height: 100%;display:flex;flex-direction:column"> <!-- 上 这个navbar是有高度的--> <van-sticky> <van-nav-bar class="nav-bar" left-arr