随笔分类 - VUE
摘要：1.作用：让父组件可以向子组件指定位置插入html结构，也是一种组件间通信的方式，适用于 父组件 > 子组件 。 2.分类：默认插槽、具名插槽、作用域插槽 3.使用方式： ①默认插槽 当父组件没有插入时，插槽显示默认内容（一般slot标签内部不写内容） 父组件中： <Category> <div>父
阅读全文
摘要：vue2中使用composition-api https://juejin.cn/post/6874927606820274184 vue3.0 watch 函数 https://www.jianshu.com/p/bb7de2248df9 https://www.cnblogs.com/maggi
阅读全文
摘要：1 npm install --save qrcodejs2 1 <template> 2 <!-- 二维码 --> 3 <div class="qrcode"><div id="qrcodeImg"></div></div> 4 </template> 5 6 <script lang="ts">
阅读全文
摘要：类似这种滚动轮播效果 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8" /> 5 <title>vue.js动态文字滚动公告代码</title> 6 <script src="https://cdn.bootc
阅读全文
摘要：vue2.x(vue-cli3)中使用ts https://www.jianshu.com/p/3cbcdd766295 https://www.cnblogs.com/xiaohuizhang/p/11872044.html Vue3.0+TS 项目教程(四不像) https://blog.csd
阅读全文
摘要：前言： 用到的库参考链接： FileReader：https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader 这个在之前的下载excel的随笔中有用到 xlsx: https://www.npmjs.com/package/xlsx 本次用
阅读全文
摘要：https://v2.h5player.bytedance.com/en/api/ 1 npm install xgplayer 1 <div id="mse"></div> 2 <div id="box"></div> 1 <script> 2 import Player from "xgplay
阅读全文
摘要：1、安装依赖 npm install --save-dev svg-sprite-loader 2、 新建svg资源文件夹 src/assets/svg 将svg资源放入此目录，接下来会在配置文件中该路径 3、vue-cli 脚手架项目3.x 以上配置 vue.config.js 1 const p
阅读全文
摘要：之前一篇随笔写到vue多环境打包环境配置：https://www.cnblogs.com/shun1015/p/13411636.html 1.区分vue脚手架版本，版本不同，项目结构不同，多环境变量配置方式不同 package.json文件里 scripts对象上配置打包命令 2.打包后的代码如何
阅读全文
摘要：一，安装vue-lottie 1 npm install --save vue-lottie 二，引用vue-lottie 在main.js引入并全局注册组件也可在页面单独引用 1 import lottie from 'vue-lottie'; 2 Vue.component('lottie',
阅读全文
摘要：配置前言 项目构建：基于vue-cli3构建，使用postcss-px2rem px2rem-loader插件进行rem适配实现原理：每次打包，webpack通过使用插件postcss-px2rem，帮我们自动将px单位转换成rem单位前方有坑：UI框架部分组件使用JavaScript将css作为内
阅读全文
摘要：现在基于vue全家桶技术体系，基本上可以开发各端的各种应用，pc端的应用，开发完成以后，直接运行打包命令 yarn build 即可打包，部署到服务器端上线即可。那么，今天我们来聊一聊，开发好的vue移动端应用，如何打包成app，安装在自己的手机上呢？ 首先，基于vue开发的应用，现在主流的是使用v
阅读全文
摘要：一，安装sass 1 npm i sass sass-loader --save 二，安装element主题生成工具 // 全局安装npm i element-theme --save // 安装主体工具，注意没全局装 npm i element-theme -D 三，安装chalk主题 1 npm
阅读全文
摘要：1.安装mockjs 和axios 1 npm install --save-dev mockjs 2.在src目录下创建mock文件夹，并创建index.js文件，内容如下： 1 import Mock from 'mockjs' 2 3 Mock.mock('/cityMeunList', /p
阅读全文
摘要：1 npm install html2canvas --save <template> <div class="QRCode-box"> <img id="imageWrapper" class="QRCode" src="@/assets/shun.png" alt="" /> <button c
阅读全文
摘要：pdf预览，在项目中是很常见的需求，在PC端web项目中，我们可以使用window.open(url)直接打开pdf进行预览，那么移动端虽然我们也可以使用此方法，但是这是新开了一个webview页面，里面的内容也不是我们可以控制的 安装插件 vue-pdf 1 npm install --save
阅读全文
摘要：此方法获取验证码倒计时一分钟，刷新页面不清0，主要利用本地存储，延时器，递归实现 <el-button :disabled="!BtnStatus" @click="validateBtn">{{BtnStatus ? '获取验证码' : `${countDownTime}秒后获取`}}</el-b
阅读全文
摘要：前言： 组件库的文件上传不适合项目，这里我们利用input标签实现文件上传 首先input type=file 标签是这个亚子的，而且样式不能改，我们利用css的方法，将一个定位到这个下面来，然后input标签opcity:0，就哦了 用法： input的accept属性，支持选择的文件类型，win
阅读全文
摘要：混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。 假设我 demoA组件和demoB组件中有相同的一些方法和处理逻辑。这时候我们为了不写重复的代码，可以视情
阅读全文
摘要：一，为什么要使用路由懒加载 为给客户更好的客户体验，首屏组件加载速度更快一些，解决白屏问题 二，懒加载简单来说就是延迟加载或按需加载，即在需要的时候的时候进行加载 三，常用的懒加载方式有两种：即使用vue异步组件 和 ES6中的import 1、未用懒加载，vue中路由代码如下 1 import V
阅读全文
浙公网安备 33010602011771号