一、技术提要涉及element-ui中的validate方法二、具体实现1、表单部分代码<el-form ref="loginFormRef" :model="loginForm" :rules="loginFormRules" label-width="0px" class="login_form"> <!-- 用户名 --> <el
一、背景在使用 vue-cli 构建移动端项目的时候,移动端自适应应该是很常见的需求了,之前见过有直接在 html 文件head 标签内添加 rem 设置的,这里分享一下使用淘宝的 lib-flexible 和 px2rem-loader 配合 vue-cli 构建的项目配置移动端自适应。话不多说,上方案,有问题希望大家多提问题和其他方案!!!!!二、方案方案一、rem + 根font-size设
性能分析 借助插件 webpack-bundle-analyzer 先安装运行npm install webpack-bundle-analyzer –save-dev配置在vue.congfig.js中配置好 BundleAnalyzerPlugin 代码如下   const BundleAnalyzerPlugin = require('webpack-bundle-ana
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。Vue 的核心库只关注视图层,易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。Vue项目开始之前要把相关的插件跟问价导入进来,引用文件的时候还要注意路径的问题,项目中如果遇到了404,那就是文件的路径引用不对,或者是项目
屏幕的有效宽高:window.screen.availHeight window.screen.availWidth  网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWidth (包括边线的宽) 网页可见区域高:document.bod
转载 2024-09-20 19:18:59
59阅读
Vue读取网络路径Excel文件转换为Html预览,打印前言一、预览EXCEL文件1.获取网络路径Excel文件2.转换格式后的数据3.最终结果二、打印文件 前言我们需要对一些Excel文件进行预览,那么可以调用第三方的接口转到别的页面进行预览,可是这样比较花费时间,而且还受到网络网速的影响。因此我们可以将Exce文件转为html的table格式或者是json格式来达到我们获取信息的目的一、预览
转载 2024-04-09 13:20:41
62阅读
前言 好记性不如烂笔头。 从事Web前端这份工作也好几年了,以前去Web前端应聘岗位的时候,总是会问到一些我知识盲点,又或者是一些高频专业题目答不上来,导致我错失良机,无法进入心仪的企业工作。是的,记性不好,就要拿小本本记下来。常识主流浏览器内核IE 浏览器(Trident 内核)Microsoft Edge 浏览器(EdgeHTML 内核/ Blink 内核)Firefox 浏览器(G
黑马面面(vuePC端项目)主要就是后台管理系统01-项目创建:01-1、就跟之前一样,安装脚手架(前面也有写也都做过,这里粗略写一下)        a.参考地址:https://cli.vuejs.org/zh/guide/installation.html      &nb
作者:前端小黑前言 本文的目标是通过下文介绍的适配方案,使用vue或react开发移动端及H5的时候,不需要再关心移动设备的大小,只需要按照固定设计稿的px值布局,提升开发效率。下文给出了本人分别使用create-react-app搭建的react(create-react-app)项目和使用vue-cli 2.x 搭建的vue项目中的 亲测可用 配置方案。px2rem或postcss-px2re
vue3.0正式版本已经发布超过一年,社区生态已经完善,所以,是时候开始使用vue3.0了目前已支持 vue3 的UI组件库ant-design-vuehttps://antdv.com/docs/vue/introduce-cn/ant-design-vue 是 Ant Design 的 Vue 实现,组件的风格与 Ant Design 保持同步目前支持 Vue 3.0 的 2.0.0 测试版
今天分享下”如何区分absolute与relative—html“这篇文章,文中根据实例编码详细介绍,或许对大家的编程之路有着一定的参考空间与使用价值,需要的朋友接下来跟着云南仟龙Mark一起学习一下吧。 HTML的relative与absolute区别:说实话html这门语言算的上是这个世界上最简单的一门语言了,标签语言嘛,就是标签多了点英文单词超多,不过都是有规律的比如文本类居中text-al
样式如下需要注意的点实现题目内容的最外层即循环题目数据的位置谨慎使用div标签包裹,否则v-if控制的样式可能有问题。使用div标签包裹并且在最外层设置题目样式的页面:<div class="topicContent" v-for="item in subjectType" :key="item.type"></div>.topicContent{ height:
转载 2024-03-27 08:25:03
42阅读
behavior=移动效果>插入文字,alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动) scrollAmount="移动速度" direction="方向"肢体颜色设置<font face=宋体 color=#9932cc size=5>ziti</font>古典白色 :古典白色antiquewhite浅绿色:浅绿色aqua碧绿色
转载 2024-05-10 18:02:56
58阅读
动态布局动态布局主要表现在两方面: 1、布局本身是非固定的 2、布局的内容是非固定的引起布局动态变化的因素我们称动态因子,通常情况下,动态因子是css样式,也就是说,通过使用不同的样式以达到动态变更布局的效果。然后在特殊情况下,动态因子也可以是数据,也就是说,可以根据不同的数据来影响布局的显示从而达到动态的效果。知识点:grid布局,VUE组件显示效果场景一:完整显示3*4布局 场景二:完整显示3
做移动端的适配我们就是要考虑,对于不同大小的手机屏幕,怎么动态改变页面布局中所有盒子的宽度高度、字体大小等。这个问题我们可以使用相对单位rem。那么什么是 remrem(font size of the root element)是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。设置 html 的 font-size 属性,rem根据它的大小来动态变化整个项目中使用 rem 单位
摘要:rem 是相对于 html 的 font-size,只需要确定了 html 的 font-size 的 px 字号,就可以计算出元素的宽高。 什么是 rem首先大家应该知道 em 单位,em 指的是相对于父元素的字体大小的单位,而 rem 指的是相对于 html 的字体大小的单位。例如:html 的 font-size 值为 10px ,那么 1rem 代表的就是 10px,2r
1、rem是什么?rem是目前好多企业都在使用的移动端界面的适配方案,是一种尺寸单位。 rem单位:相对单位rem单位是相对于HTML标签的字号计算结果1rem = 1HTML字号大小网页的根就是 html 标签 rem的样式代码如下:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UT
 Vue插件概述简单来说,插件就是指对Vue的功能的增强或补充。比如说,让你在每个单页面的组件里,都可以调用某个方法,或者共享使用某个变量,或者在某个方法之前执行一段代码等总体流程应该是:【声明插件】——【写插件】——【注册插件】——【使用插件】写插件和声明插件是同步的,然后注册到Vue对象中(不用担心重复注册),最后在写Vue组件的时候使用写的插件1.声明插件先写一个js文件,这个js
转载 2024-10-16 16:52:25
60阅读
前言vue-property-decorator,@Model选项,也就是vue2.2中新增的实例model选项。原来只知道v-model属性实现双向绑定,对这个model选项突然不是很理解。所以这里 重新对v-model和自定义组件的v-model做一个回顾,加深印象后,再去理解model选项到底是做什么的,有什么作用。vue中的v-model指令实现了表单的双向绑定,这是官网的一个栗子:&lt
vue中env文件的配置vue项目中env文件的配置文件名:文件内容:关于文件的加载process.env属性注意修改完要重新启动一遍项目vue项目中 .eslintrc.jsvue项目中 .gitignorevue 项目中 .eslintignorevue 项目中.stylelintrc.jsvue 项目中 jsconfig.jsonvue 项目中 .editorconfig vue项目中en
转载 2024-10-25 20:49:08
52阅读
  • 1
  • 2
  • 3
  • 4
  • 5