vue

vue qrcode生成二维码，并监控失效 刷新二维码

  • Post author:
  • Post category:vue

效果图 1.首先安装插件 npm install qrcodejs2 --save 2.html代码 <div class="qrcode" ref="qrCodeUrl" ></div> <h1 class="faceCode-shade pa" v-if="isTimeout"> <p>二维码已失效</p> <a @click=…

继续阅读 vue qrcode生成二维码，并监控失效 刷新二维码

Vue框架之过渡与动画

  • Post author:
  • Post category:vue

1. 作用：在插入、更新或移除 DOM元素时，在合适的时候给元素添加样式类名。 2. 图示： 3. 写法： 3.1. 准备好样式： - 元素进入的样式： 1. v-enter ：进入的起点 2. v-enter-active ：进入过程中 3. v-enter-to ：进入的终点 - 元素离开的样式： 1. v-leave ：离开的起点 2. v-leave-active ：离开过程中 3. v-…

继续阅读 Vue框架之过渡与动画

vue element-ui响应式布局（记录）

  • Post author:
  • Post category:vue

1.可以实现Vue移动端和PC端的响应式布局适配 实现方法：通过 postcss-px-to-viewport 来自动将我们开发时的px单位计算转换为vw/rem视口单位,完成响应式布局 。 安装插件 npm安装 npm install postcss-px-to-viewport -S npm安装 npm install postcss-px20px -S npm安装 npm install p…

继续阅读 vue element-ui响应式布局（记录）

vue 项目使用 prismjs 高亮显示代码

  • Post author:
  • Post category:vue

在框架中写文档所以想要代码高亮显示 1.首先安装prismjs npm install prismjs 2.安装babel-plugin-prismjs npm install babel-plugin-prismjs 3.配置babel.config.js module.exports = { presets: ["@vue/cli-plugin-babel/preset"], plugins:…

继续阅读 vue 项目使用 prismjs 高亮显示代码

在vue中CSS控制一个元素或图片进行上下左右的反复移动

  • Post author:
  • Post category:vue

记录一个常用的样式动作 元素代码 这里就不累述图片的变化了，直接默认是一个大div即可。 <!-- 图片集合--> <div class="view" > </div> CSS代码 <style scoped> .view { /* jumpBoxHandler 动作函数 2s 动作持续两秒 infinite 无限循环 */ animation: j…

继续阅读 在vue中CSS控制一个元素或图片进行上下左右的反复移动

vue组件的两种切换方式及动画切换

  • Post author:
  • Post category:vue

<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Document<…

继续阅读 vue组件的两种切换方式及动画切换

vue和js原生实现数组元素依次前后交换位置

  • Post author:
  • Post category:vue

需求： 此案例在vue中才能体现出真正价值，但是却很好的考察了js的基础扎不扎实 先来个js原生的底层逻辑和js的基础知识 <script> let arr = ["帅哥", "美女", "程序猿"] // 筛选出数组的第一个元素 let firstArr = arr.filter((item, index) => index === 0) // 筛选出数组的除第一个元素的其他元…

继续阅读 vue和js原生实现数组元素依次前后交换位置

计算机毕业设计Node.js+Vue安卓基于移动平台校园旧教材交易APP(程序+源码+LW+部署)

  • Post author:
  • Post category:vue

该项目含有源码、文档、程序、数据库、配套开发软件、软件安装教程。欢迎交流 项目运行 环境配置： Node.js+ Vscode + Mysql5.7 + HBuilderX+Navicat11+Vue+Express。 项目技术： Express框架 + Node.js+ Vue 等等组成，B/S模式 +Vscode管理+前后端分离等等。 环境需要 1.运行环境：最好是Nodejs最新版，我们在这…

继续阅读 计算机毕业设计Node.js+Vue安卓基于移动平台校园旧教材交易APP(程序+源码+LW+部署)

Vue v-bind v-model的使用

  • Post author:
  • Post category:vue

v-model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定，指的就是我们在js中的vue实例中的 data与其渲染的dom元素上的内容保持一致 ，两者无论谁被改变，另一方也会相应的更新为相同的数据 最基础的就是实现一个联动的效果 <body> <div class="app"> <span>Multiline message is:</span&g…

继续阅读 Vue v-bind v-model的使用

vue实现大屏适配方案 （lib-flexible和postcss-px2rem-exclude）—– 建议收藏

  • Post author:
  • Post category:vue

vue实现大屏适配方案 （lib-flexible和postcss-px2rem-exclude）----- 建议收藏 ? 最近在做一个大屏的项目，需要实现布局以及字体样式自适应，实在不想写媒体查询了，所以找到了两个相关插件感觉很不错，这里就做个总结啦！ 适配解决思路： 解决适配问题的根本思路在于将px转换成rem rem介绍： rem是CSS3新增的一个 相对长度单位 。相对于 根元素(即htm…

继续阅读 vue实现大屏适配方案 （lib-flexible和postcss-px2rem-exclude）—– 建议收藏