import store from '@/store' const { body } = documentconst WIDTH = 992 // refer to Bootstrap's responsive design mounted() { const isMobile = this.$_i ...
转载 2021-09-30 15:30:00
594阅读
2评论
这段时间在做的东西,是北邮人论坛APP的注册页。这个注册页是内嵌的网页,因为打算安卓和IOS平台同时使用。因此实际上就是在做移动的web开发了。 在这过程中遇到了不少有意思的东西。DEMO的github地址在这里内容提要:meta标签Vuejs的简单实战CSS移动全屏背景CSS移动动画初探meta标签这点与在PC写前端有着很大的区别,移动的meta标签简直多。我就说说我所用到的标签。&l
vue搭配vant组件可以做手机APP界面(vant是业界主流的移动组件库之一)我们可以使用vue和组件vant实现简单的登录和注册,下面是我做出来的样子(这是在手机测试的界面)里面很多组件都是在vant官网上面直接拿来使用的其中,手机适配是我上一篇的博客的内容。其中我做了一些小的提示:1. 登录成功后有“登录成功”提示 2. 未输入用户名和密码会提示“请输入账号或密码” 3. 用户名或密码错
【饿了么】—— Vue2.0高仿饿了么核心模块&移动Web App项目爬坑(一) 前言:学习Vue.js高仿饿了么课程过程中,总结了这个Web App项目从准备到开发完毕自己觉得很重要的知识点。这一篇主要介绍:项目准备、页面骨架开发、header组件开发。 Appheader 一、项目分析&学习目标      
转载 2023-08-22 11:38:53
324阅读
正在苦逼的实习中,昨天公司让做一个页面,涉及到检测终端的问题,如果是手机设备,就跳转到指定的网页上,以前写响应式布局只要用@media screen来实现布局的差异化适应,但是现在不仅仅是布局,还要针对移动做一些别的动作,所以看了点资料,做个总结 正在苦逼的实习中,昨天公司让做一个页面,涉及到检测终端的问题,如果是手机设备,就跳转到指定的网页上,以前写
考虑到网站的在多种设备下的兼容性,有很多网站会有手机版和电脑版两个版本。访问同一个网站URL,当服务识别出用户使用电脑访问,就打开电脑版的页面,用户如果使用手机访问,则会得到手机版的页面。1、判断客户的设备类型要想让网站适配PC和手机设备,首先要能做出准确的判断。HTTP请求的Header中的User-Agent可以区分客户的浏览器类型,可以通过User-Agent来判断客户的设备。无论是
使用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阅读
公司的项目由于安全需要,对某一特定的页面需要监听是否被用户截屏了。简单搜了一下,很少有这方面的问题,没办法,只能自己折腾了。目前想到三种思路:1、监听广播当然,前提是系统在截屏的时候发送某一广播,然而并没有。2、监听按键android手机按下“电源键+音量减”会进行截屏,此外大部分手机状态栏下拉的页面中也会有截屏按钮。遗憾的是,监听这两处的操作并不是一件让人开心的事儿~~。3、监听手机中图片的变化
好久没复习js了,今天正好之前的项目要重新写一套移动的代码,之前的没有做移动的兼容,故将遇到的问题写在上面:在移动设备应用越来越广泛的今天,许多网站都开始做移动的界面展示,两者屏幕尺寸差异很大,所以展示的内容也有所差别。于是就遇到一个问题,如何判断你的页面是在移动还是在PC打开的,很简单的问题,那我们就简单点来说:Navigator对象  首先来了解一下Navigator 对象,Navi
1.删除功能:需求:就是点击删除会弹出弹框--根据选择---删除相应的内容 实现的思路:1.利用element组件找到对话框或弹出层,然后进行相应的修改即可(注:这里需要传递id)代码展示:①布局忽略  只有js部分//删除是需要调用接口的 并且需要传递相应的id 如: (具体操作参照接口文档) // 删除权限 export function delPermission(id
1.报错 组件没注册报错 js vue.esm.js?efeb:591 [Vue warn]: Unknown custom element: did you register the component correctly? For recursive components, make sure ...
转载 2021-10-11 13:34:00
172阅读
2评论
1. 设置动态根字号大小,/public/phone-adapt.js,在index.html中引入 (function (doc, win) { const docEl = win.document.documentElement; const resizeEvt = 'orientationch ...
转载 2021-10-22 13:21:00
857阅读
2评论
Mint UI由饿了么前端团队推出的 Mint UI 是一个基于 Vue.js 的移动组件库。自 6 月初开源以来,根据社区和团队内部的反馈,修复了一些 bug 并新增了部分组件,于本周发布了 0.2.0 版本。本文介绍如何从零开始构建一个使用 Mint UI 的 Vue 项目。脚手架随着 Vue.js 的迅速发展,目前搭建一个 Vue 项目的脚手架已经有不少选择了。比如可以使用官方提供的&nb
        Vue 移动、PC 适配可以使用 lib-flexible、amfe-flexible、postcss-pxtorem、postcss-px2rem 和 postcss-px-to-viewport 这几个插件。       &n
vue项目pc移动适配1、pc适配一、样式中根据设计稿确定缩放比例(可以设置全局或者部分页面)二、监听窗口大小改变,设置根字体大小 created() { // 获取当前设备的宽度,设置rem的根字体大小 let width = window.innerWidth; width = width <= 1200 ? 1200 : width; const htmlObj = d
vue 移动拖曳指令
转载 2021-12-28 11:53:37
147阅读
  • 1
  • 2
  • 3
  • 4
  • 5