vue2.0 - 随笔分类 - 完美前端

vue uniapp 弹出层背景穿透，穿层

摘要：// 投注信息弹窗内容组件上 @touchmove.stop.prevent="() => {}" u-popup :show="show" @close="show= false" @open="open" component @touchmove.stop.prevent="() => {}" 阅读全文

posted @ 2023-12-10 13:38 完美前端阅读(294) 评论(0) 推荐(0)

vue3 实现移动端h5多个输入框填入验证码功能（非常简单）

摘要：完整的代码, 可以复制引用效果页面内容 <ul class="lists" ref="inputs"> <li class="list" :class="{active: data.value[0]}">{{data.value[0]}}</li> <li class="list" :class 阅读全文

posted @ 2023-07-27 00:07 完美前端阅读(975) 评论(0) 推荐(0)

uniapp 图片文件流

摘要：使用 uni.request 请求数据并处理返回的文件流以下代码演示了如何使用 `uni.request` 发起 GET 请求，并处理返回的文件流数据。 uni.request({ url: '*****', // 仅为示例，并非真实接口地址。 method: 'GET', responseTyp 阅读全文

posted @ 2022-08-26 21:43 完美前端阅读(2457) 评论(0) 推荐(0)

vue 使用 swiper vue-awesome-swiper

摘要：文档与演示链接文档地址演示地址 NPM安装指令 npm install swiper vue-awesome-swiper@4.1.1 --save 代码部分 // 引入 Swiper 和 vue-awesome-swiper，以及Autoplay模块 import SwiperCore, {A 阅读全文

posted @ 2022-07-24 20:11 完美前端阅读(1116) 评论(0) 推荐(0)

vue2 拖拽组件

摘要：完整的代码, 可以复制引用 Vue 右上角拖拽的客服图标组件 <template>  <a :href="$store.state.user.info.kefulink" class="server" ref="drawable" :style="{right: rig 阅读全文

posted @ 2022-06-04 19:57 完美前端阅读(1642) 评论(0) 推荐(0)

vue 国家地区组件，带国家图标，带搜索

摘要：完整的代码, 可以复制引用 <template>  <view>  <view class="popup-bg" @click="getCountrieCode"></view>  <vi 阅读全文

posted @ 2022-05-22 18:55 完美前端阅读(747) 评论(0) 推荐(0)

html播放youtube

摘要：嵌入YouTube视频 iframe代码 <iframe width="100%" style="min-height: 260px;position: absolute;top: 0;bottom: 0;margin: auto 0;" src="https://www.youtube.com/e 阅读全文

posted @ 2022-05-07 02:59 完美前端阅读(228) 评论(0) 推荐(0)

html 和 vue 使用播放器 TcPlayer

摘要：#### TcPlayer视频播放器引入TcPlayer库 <script src="./js/TcPlayer-2.4.5.js" charset="utf-8"></script> HTML结构 <section v-if="videoShow" style="position: fixed; 阅读全文

posted @ 2022-05-07 02:56 完美前端阅读(2183) 评论(0) 推荐(0)

html中使用引入vue公共组件

摘要：问题描述在一个使用传统 `.html` 文件搭建的vue项目中，Vue 只被用作数据渲染工具。每个页面都有相同的 header 和 footer，导致有大量重复代码。现在的目标是将 header 和 footer 提取出来，使代码更加整洁。解决办法 1. 将公共部分（如 header 和 fo 阅读全文

posted @ 2022-04-03 19:27 完美前端阅读(1506) 评论(0) 推荐(0)

html中使用vue 和 vue模块

摘要：#### 在Vue中使用http-vue-loader加载组件要使用vue组件的话，需要引入http-vue-loader.js 要在服务器的环境下打开开发时本地服务器或 idea打开 HTML结构 <!DOCTYPE html> <html lang="en"> <head> <meta c 阅读全文

posted @ 2022-03-10 20:25 完美前端阅读(1404) 评论(0) 推荐(0)

网页移动端 vue-video-player 视频播放器使用记录

摘要：完整的代码, 可以复制引用引入视频播放器插件 npm i vue-video-player -D import VideoPlayer from 'vue-video-player' require('video.js/dist/video-js.css') require('vue-video- 阅读全文

posted @ 2022-03-03 15:23 完美前端阅读(1566) 评论(0) 推荐(0)

vue uniapp v-html跑马灯

摘要：// 通知组件的布局 <view class="notice"> <view class="notice-left"></view> <view class="notice-right"> <view class="notice-right-content" :style="{left: -left 阅读全文

posted @ 2021-10-23 20:55 完美前端阅读(248) 评论(0) 推荐(0)

vue监听浏览器后退前进按钮

摘要：Vue监听浏览器的后退与前进按钮 // 检查浏览器是否支持history API if (window.history && window.history.pushState) { // 如果支持，给window添加popstate监听事件，用于监听后退按钮的点击 window.addEventLi 阅读全文

posted @ 2021-09-27 19:31 完美前端阅读(2527) 评论(0) 推荐(0)

vue 刷新页面的几种方法

摘要：1、最直接整个页面重新刷新： // 使用location.reload()方法刷新页面 location.reload() // 使用Vue路由的$router.go()方法刷新当前页面 this.$router.go(0) 这两种都可以刷新当前页面的，缺点就是相当于按ctrl+F5 强制刷新那种，阅读全文

posted @ 2021-09-13 22:55 完美前端阅读(2549) 评论(0) 推荐(0)

vue 巧妙刷新 provide 和 inject

摘要：// 导入vue中的相关方法 import { provide, reactive, nextTick } from "vue"; // 定义全局数据 let globeData = reactive({ isRouterAlive: true }) // 通过条件渲染来控制router-view的阅读全文

posted @ 2021-09-11 22:19 完美前端阅读(486) 评论(0) 推荐(0)

vue v-cloak妙用白屏花屏

摘要：Vue 在初始化时，由于 DOM 元素不归 Vue 管理，导致我们在代码中写的模板在未被 Vue 解析之前可能会直接显示在页面上。这会造成短暂的花屏现象，使得用户可能会看到{{message}}这样的原始模板代码。虽然这种情况下的显示时间通常非常短暂，但为了优化用户体验，我们还是应该解决这个问题阅读全文

posted @ 2021-08-27 21:15 完美前端阅读(260) 评论(0) 推荐(0)

chimee 视频插件和 video.js 视频插件

摘要：chimee 视频插件和 video.js 视频插件参考文档： https://www.cxyzjd.com/article/Evil_0_0_0/105768336 chimee 视频插件相关链接官网 API 文档 cdn.baomitu.com 上的资源 cdnjs.com 上的资源 Gi 阅读全文

posted @ 2021-08-23 22:30 完美前端阅读(586) 评论(0) 推荐(0)

vue获取滚动条距离

摘要：// 定义一个函数用于获取滚动条的距离 function getScrollTop() { let scrollTop = 0; // 如果文档的元素存在，并且文档的元素有滚动条距离 if (document.documentElement && document.documentElement.s 阅读全文

posted @ 2021-08-16 23:42 完美前端阅读(1293) 评论(0) 推荐(0)

Content-type 所有类型的参数

摘要：{ '.323': 'text/h323', // H.323 网络电话 '.3gp': 'video/3gpp', // 3GPP 视频文件 '.aab': 'application/x-authoware-bin', // Authoware 二进制文件 '.aam': 'application 阅读全文

posted @ 2020-05-01 07:52 完美前端阅读(3190) 评论(0) 推荐(0)

vue2.0---typeScript

摘要：新项目在创建的时候勾选上ts 已存在项目安装ts， vue add @vue/typescript 不建议在已有的项目安装ts 会把所有的js替换为ts，是破坏性的。阅读全文

posted @ 2020-04-29 16:53 完美前端阅读(761) 评论(0) 推荐(0)

完美前端

随笔分类 - vue2.0