从我工作以来,开发的一直都是移动的页面,只有偶尔去开发几个PC的页面,现在是一个移动的时代,移动先行已经深入骨髓,作为一个web前端开发,如果你还在为如何开发移动页面而迷茫,或者你还在为开发出了一个在你手机上“完美”的移动页面而沾沾自喜却不知移动的世界有多“残酷”的时候,那你应该看看这篇文章了。希望这能给你帮助,同时也能给我帮助,有不合理的地方,欢迎评论支持,必将改正。这里是基础,你了解否
转载 2024-10-09 17:47:16
33阅读
文章目录1. ElementUI简介2. 弹窗基本使用3. 实现拖拽移动功能4. 拓展与分析 在Web应用中,弹窗是常见的交互组件之一,ElementUI 是 Vue.js 非常流行的 UI 框架之一,提供了丰富的组件库,其中的 Dialog 弹窗组件功能强大。但是,在某些场景下,我们可能需要自定义一些交互行为,比如实现 Dialog 弹窗的拖拽移动功能。本文将介绍如何在 ElementUI 的
转载 2024-09-07 20:47:03
127阅读
上一篇文章完成了Router4.0的集成,已经页面的切换。那么就应该开始对每个页面的内容做设计了,vue有很很多支持的第三方UI库,其中使用最广泛的就是 elementUI 。这次 elementUI 的集成为了适配我们Vue3.0特地选择了官方对应的版本 element-plus 。安装首先进行依赖的安装,这里直接使用npm方式:npm install element-plus --save然后
转载 2024-04-19 19:14:05
2837阅读
        前端组件库是一种用于构建 Web 应用程序用户界面的工具。它提供了一组可重用的组件,这些组件可以帮助开发者更快地构建出漂亮、功能强大的用户界面。         使用前端组件库有很多好处。首先,它可以提高开发效率,因为组件已
转载 2月前
520阅读
文章目录js处理浮点数保留两位小数前言处理方法1:转换字符串截取法2:正则表达式处理3:Math.round()方法,四舍五入处理最后补充Math的其他方法Vue使用less报错的解决方法前言解决指定较低版本的less-loader来下载以下是解决时的截图我新建的项目下载的less,less-loader版本我新建的项目使用less报错查看之前模板的less,less-loader版本将最新的l
转载 2024-09-27 09:31:10
34阅读
鄙人最近才刚刚开始学习一些关于移动的知识,还只是个小白,文中可能有许多理解错误,望指出,请多多见谅。响应式什么是响应式页面呢?顾名思义响应式页面就是能做出响应的页面,它的页面效果不是定死的,会随着用户的改变而改变。如何着手响应式有以下几个思考的方向找一份设计图使用Media Query隐藏元素添加meta viewport明白手机交互方式的区别Media Query是什么Media query
我们在vue移动项目中的适配一般都采用rem,但是rem也不是能兼容所有的终端。随着viewport单位越来越受到众多浏览器的支持,下面将简单介绍怎么实现vw的兼容问题,用vw代替rem当我们采用vue-cli脚手架搭建完项目,安装所有依赖包之后,用npm run dev启动后,在根目录有一个 .postcssrc.js 文件,文件结构如下:vue-cli默认已经安装以上三个插件:postcss
终于把书写完,接下来恢复之前的更文频率。这篇文章我们来谈谈移动和PC交互设计上的区别。经常遇到一些设计师,他们之前负责的都是pc产品,突然改做移动,会不自觉的把pc的一些设计理念“移植”到移动,出现了水土不服。有经验的设计师一看你设计的移动页面就知道你之前做的都是pc,这是一件非常尴尬的事情。就好像你说了一句“nice to meet you”,别人就知道你老家是哪里一样。那么移动
01-搭建项目结构步骤:1.0 在桌面上打开终端2.0 使用终端创建一个项目 执行指令: vue create heimatt(heimatt是项目名字+6) 生成项目时选择: Manually select features 选择自己项目中需要用到的特性: babel、vuex、vue-router、css Pre-process、eslint 是否开启 history 模式 ,
web移动布局范畴很广,其中比较基础的几个话题:移动适配1px border基础布局本文主要分享这三个话题一、移动适配提起移动适配,大家想到的肯定是rem、flexible.js,本文要分享的方案是 vw + rem对移动适配不熟悉的同学,可以看看:使用Flexible实现手淘H5页面的终端适配再聊移动页面的适配如何在Vue项目中使用vw实现移动适配vw 是什么?vw 是基于视图(V
WebApp开发之--"rem"单位随着web app的兴起,rem这是个低调的css单位,近一两年开始崭露头角,有许多朋友对于它的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了。但是我认为rem是用来做web app它绝对是最合适的人选之一。一、rem是什么?rem(font size of the root element)是指相对于根元素的字体大小的单位。 简单的说它就是一个相对单
在智能手机横行的时代,作为一个web前端,不会编写移动web界面,的确是件悲催的事情。当公司准备做一个微信的微网站时,作为一个多年经验的web前端码农,我迷茫了,真心不知道从何下手。 接下来就是搜一堆教程,然后开始编写代码,三天后,我的第一个移动web页面编写完成。 回头想想,移动的web页面代码编写远没有我想的那样复杂(可能是我做的这个项目比较简单的缘故)。但是就入门来说,其实是蛮简单的,我
转载 2024-09-20 17:09:52
187阅读
项目使用VUE编写,UI是ElementUI,但是Element的Upload组件是不兼容IE9的。因为IE9中无法使用FormData。查找资料基本有两种解决方法:1.引入JQuery和jQuery.form。2.使用vue-upload-component1、jQuery.form  插件提供ajaxSubmit和ajaxForm两种表单提交方式,注意:不要对同一个表单同时使用两种方式。  a
转载 2024-10-17 12:06:20
59阅读
文章目录UI组件库下载安装配置UI组件库使用mint-ui组件库中组件短消息提示框iconfont确认框创建空组件实现提示框案例mint-ui表单组件输入框开关组件单选列表表单组件案例mint-ui组件库面板底部导航条面板底部导航条案例组件中数据传递(父组件传递数据子组件) 父组件在模板中调用子组件微信消息列表功能案例用户登录案例安装xampp 软件安装nodejs 软件创建服务器目录下载安装第
最近一直在做移动微信公众号项目的开发,也是我首次用vue来开发移动项目,前期积累的移动开发经验较少。经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api(微信分享,微信支付),百度地图api(如何实例化地图,给地图添加自定义覆盖物,给地图添加自定义标注,对地图进行缩放,拖拽等)的相关使用,开阔了自己的知识眼界;现将我开发过程中积累的相关经验与大家进行分
转载 2024-09-01 16:27:43
125阅读
内容:""" 第三方插件: 1)vuex:组件间交互的(移动) 2)axios - 前后台(django):ajax 3)element-ui:页面布局 4)jq+bs:jQuery+BootStrap """ vuex插件:可以完成任意组件间信息交互(移动) - 了解""" 1)vuex是实现任何组件间的信息交互的,可以理解为全局的一个单例,为任何一个组件共享vue仓库里的数据 2
转载 2024-10-07 11:59:30
66阅读
  移动自适应方案有很多种1.流式布局也就是固定高度,宽度使用百分比的方法,这种方法会导致一些元素在大屏手机上拉伸严重的情况,影响视觉效果,只有在很少一部分手机上能完美的展示设计师想要的效果。携程之前用的就是流式布局,但之后也改版了。2.固定宽度做法比如早期的淘宝webpage,页面设置成320的宽度,超出部分留白,在大屏幕手机上,就会出现两条大百边,分辨率高的手机,页面看起来就会特别
rem这是个低调的css单位,近一两年开始崭露头角,有许多同学对rem的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了。但是我对rem综合评价是用来做web app它绝对是最合适的人选之一。rem是什么?rem(font size of the root element)是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。看到r
整合ElementUI(实现登录) ElementUI官方网址: https://element-plus.gitee.io/#/zh-CN 提示:以下是本篇文章正文内容,下面案例可供参考 文章目录整合ElementUI(实现登录)一、创建工程1.创建一个名为 vue-elementui 的工程2.安装依赖3.启动工程二、编写ElementUI页面1.目录结构2.创建视图(1)创建路由创建首页
转载 2024-10-11 21:34:52
394阅读
权限验证页面级别权限路由:默认挂载不需要权限的路由,例如:登录、主页。需要权限的页面通过 router.addRoutes(点击查看官方文档) 动态添加更多的路由规则,404拦截页面需要放在路由表的最后,否则 /404 后面的路由会被404拦截,通过路由元信息meta(点击查看官方文档)记录路由需要的权限。为了菜单列表可以被翻译,路由表的 name 属性值通过 i18n 的英文对照表来获取,也可以
转载 2024-07-02 07:14:48
36阅读
  • 1
  • 2
  • 3
  • 4
  • 5