文章目录前言一、使用插件① 纯wap项目效果:Demo:② pc&wap混合项目(我放弃了)二、老方案效果:Demo: 前言最近在给公司内部做一个BBS论坛,需要在电脑和手机上都可以操作,所以需要做移动的适配,下面是我在开发后觉得不错的一些解决方案,分享给大家。一、使用插件在vue2的时候我们可以使用lib-flexible + postcss-pxtorem 去对移动进行适配,不过
1、安装模板1.1、vue-cli3模板安装a 普通安装:npm install -g @vue/clib 淘宝镜像安装:cnpm install -g @vue/cli我这里使用的是普通安装:npm install -g @vue/cli1、首先打开命令窗口(window图标+R  输入cmd 弹出命令窗口)2、通过输入(磁盘名称:) 进入其他磁盘目录3、通过输入cd + 文件夹名称&
## Vue移动iOS兼容滚动问题 移动开发中,经常会遇到滚动问题。而在iOS设备上,滚动问题尤为突出。本文将介绍如何使用Vue解决iOS设备上的兼容滚动问题,并提供代码示例。 ### 问题描述 在iOS设备上,当我们尝试在一个元素上进行滚动时,往往会遇到以下问题: 1. 滚动不流畅:滚动动画不够平滑,有卡顿的感觉。 2. 滚动容器不可滑动:滚动的容器无法滑动,导致无法查看完整内容。
原创 8月前
218阅读
移动vue 的项目适配一直是个问题
原创 2021-10-08 18:05:11
10000+阅读
负责一个项目pc的,再上线以后呢,想兼容移动。用同一套页面 1.方法1 定义视口窗口,简单,可以在手机上看到一个缩小版的pc
原创 2022-07-06 11:50:40
763阅读
这段时间在做的东西,是北邮人论坛APP的注册页。这个注册页是内嵌的网页,因为打算安卓和IOS平台同时使用。因此实际上就是在做移动的web开发了。 在这过程中遇到了不少有意思的东西。DEMO的github地址在这里内容提要:meta标签Vuejs的简单实战CSS移动全屏背景CSS移动动画初探meta标签这点与在PC写前端有着很大的区别,移动的meta标签简直多。我就说说我所用到的标签。&l
vue搭配vant组件可以做手机APP界面(vant是业界主流的移动组件库之一)我们可以使用vue和组件vant实现简单的登录和注册,下面是我做出来的样子(这是在手机测试的界面)里面很多组件都是在vant官网上面直接拿来使用的其中,手机适配是我上一篇的博客的内容。其中我做了一些小的提示:1. 登录成功后有“登录成功”提示 2. 未输入用户名和密码会提示“请输入账号或密码” 3. 用户名或密码错
移动适配相对于PC端来说,移动设备分辨率百花齐放,千奇百怪,对于每一个开发者来说,移动适配是我们进行移动开发第一个需要面对的问题。在移动我们经常可以在head标签中看到这段代码:<meta name='viewport' content='width=device-width,initial-scale=1,user-scale=no' />通过meta标签对viewport
1.安装vueclinpm i -g @vue/cli2.创建项目vue create myProject // 选择 Manually select features Babel, Router, Vuex, CSS Pre-processors, Linter y with node-sass with standard lint lint on save In dedicated confi
转载 6天前
0阅读
【饿了么】—— Vue2.0高仿饿了么核心模块&移动Web App项目爬坑(一) 前言:学习Vue.js高仿饿了么课程过程中,总结了这个Web App项目从准备到开发完毕自己觉得很重要的知识点。这一篇主要介绍:项目准备、页面骨架开发、header组件开发。 Appheader 一、项目分析&学习目标      
转载 2023-08-22 11:38:53
324阅读
使用vue心得,聊聊vue
原创 2022-10-28 16:27:48
232阅读
Pagination.vue<template><div id="pagination" :style="{'justify-content':textAlign}"> <div> <div> <span class="pages">共 {{allCounts
原创 2021-09-09 14:21:19
521阅读
Pagination.vue<template><div id="pagination" :style="{'justify-content':textAlign}"> <div> <div>
原创 2022-03-04 13:37:54
300阅读
这里我写一下我自己用的vue 移动适配 ,可能跟别人的不一样。但是效果是一样的。我
转载 2023-02-27 15:46:50
686阅读
主要内容1.vant/rem移动适配的解决方案 2. vue/cli二次配置及优化处理 3.基于注册动态模式实现loading 4.掌握vuex永久化存储1 创建一个vue项目1.1安装vue-cli:npm install -g @vue/cli1.2初始化项目vue create vue-vant(1)选择手动配置 空格切换选中状态 插件选择这边选择了(Babel、Router、Vuex、C
转载 2月前
65阅读
一、思考 在移动越来越重要的背景下,每位web开发者对移动适配都有自己的想法。是移动优先,还是PC优先,还是两者兼得?在实际开发中这个问题是和项目产品定位有关的,也涉及到UI的设计,不是开发者能决定。但不管产品如何定位,作为开发者总是要提供最好的解决方案,是用一套样式还是多套样式?网上一搜,有静态
转载 2020-11-25 14:21:00
511阅读
2评论
css3在不同型号手机浏览器上的兼容: 对于webkit内核的浏览器, 除media、text-shadow外,使用其它属性基本上要加上webkit前缀. gradient在低版本的系统中渲染效果不丰富 ios3.2~4.3不支持position:fixed,不推荐使用 android2.1~2.3
转载 2016-03-14 17:09:00
473阅读
2评论
移动适配相对于PC端来说,移动设备分辨率百花齐放,千奇百怪,对于每一个开发者来说,移动适配是我们进行移动开发第一个需要面对的问题。在移动我们经常可以在head标签中看到这段代码:<meta name='viewport' content='width=device-width,initial-scale=1,user-scale=no' />通过meta标签对viewport
转载 1月前
178阅读
移动开发-旅游预约1. 第一章. 移动开发1.1. 移动开发方式【目标】 了解常见的移动开发方式【路径】 基于手机API开发基于手机浏览器开发混合开发随着移动互联网的兴起和手机的普及,目前移动应用变得愈发重要,成为了各个商家的必争之地。例如,我们可以使用手机购物、支付、打车、玩游戏、订酒店、购票等,以前只能通过PC完成的事情,现在通过手机都能够实现,而且更加方便,而这些都需要移动开发
但是,这个属性在某些设备上可能不起作用,因为它是一个非标准的CSS属性。为了兼容更多的设备,你可以使用JavaScr
原创 7月前
81阅读
  • 1
  • 2
  • 3
  • 4
  • 5