【vue】vue +element 搭建项目,要求既支持pc端又支持移动端
使用场景:有适配pc端改为适配pc端和移动端,使用2套css
代码实现App.vue
created: function () {
if(document.documentElement.clientWidth > 640){
require('./style/index.scss');
this.plaform = 'pc';
}else{
require('./style/mobile.scss');
this.plaform = 'mobile';
}
注意:
为2套css分别指定不同的父class
比如说pc端 css为pc.scss 父类为 .pc 移动端 mobile.scss 父类为 .mobile
作者:smile.轉角
QQ:493177502
【vue】vue +element 搭建项目,要求既支持pc端又支持移动端的更多相关文章
- Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记
前言 本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...
- 使用VUE CLI3.0搭建项目vue2+scss+element简易版
1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...
- vue.js + element 搭建后台管理系统 笔记(一)
此文仅记录本人在搭建后台系统过程中遇到的难点及注意点,如果能帮到各位自然是极好的~~~ 项目主要架构:vueJS.elementUI.scss 一.项目初始化 首先需要安装nodejs,安装方法就不在 ...
- vue教程3-webpack搭建项目
vue-cli https://cli.vuejs.org/zh/ vue-cli是vue的命令行工具,对于创建项目,安装各种组件,运行项目都极为方便,是在开发vue中的必备工具 vue-cli基于n ...
- 【vue】vue +element 搭建项目,mock模拟数据(纯干货)
1.安装mockjs依赖 (c)npm install mockjs --save-dev 2.安装axios(Ajax) (c)npm install --save axios 3.项目目录 4.设 ...
- 【vue】使用vue+element搭建项目,Tree树形控件使用
1.依赖安装 本例中,使用render-content进行树节点内容的自定义,因此需要支持JSX语法.(见参考资料第3个) 在Git bash中运行一下指令 cnpm install\ babel-p ...
- 【vue】vue +element 搭建项目,将js函数变成vue的函数
demo:时间转换 1.目录 <1>在src文件夹下新建文件夹prototypefns--------在此文件夹创建util.js, <2>在prototypefns下新建文件 ...
- 【vue】vue +element 搭建项目,组件之间通信
父子组件通信 父 通过props属性给 子传递数据 子 操作 父 this.$parent.XXX 子通过$emit传递参数 或者通过vue-bus vue-bus既可以实现父子组件之间的通信,也可 ...
- 【vue】vue +element 搭建项目,vuex中的store使用
概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...
随机推荐
- layui 弹出框改变按钮颜色样式 自定义皮肤
1.在layer下新建文件夹和css 文件: 2.123.css body .layui-ext-yourskin .layui-layer-btn0{ border-color: #55ff83; ...
- 花十分钟,让你变成AI产品经理
花十分钟,让你变成AI产品经理 https://www.jianshu.com/p/eba6a1ca98a4 先说一下你阅读本文可以得到什么.你能得到AI的理论知识框架:你能学习到如何成为一个AI产品 ...
- 网络控制器intel 82599, powerpc 830的BD描述符结构
一.Intel 82599的BD结构 1.文档名称“82599-10-gbe-controller-datasheet.pdf”,可以从intel官网上下载. https://www.intel.cn ...
- iOS ----------如何修改mac的host文件
第一步:前往文件夹 或者 按快捷键组合 Shift+Command+G 三个组合按键. 第二步:前往/private/etc/ 找到Hosts 文件 复制到桌面 修改 然后 保 ...
- struts2从认识到细化了解
目录 Struts2的介绍与执行流程 介绍: 执行流程: 运行环境搭建 基础示例 Action类的编写 介绍: 访问servlet API 补充: 配置文件 常见配置文件: 常量的配置: struts ...
- Javascript数组系列三之迭代方法2
今天我们来继续 Javascript 数组系列的文章,上文 <Javascript数组系列二之迭代方法1> 我们说到一些数组的迭代方法,我们在开发项目实战的过程中熟练的使用可以大大提高我们 ...
- GitHub Flow & Git Flow 基于Git 的两种协作开发模式
介绍基于Git 两种协作开发模式,GitHub Flow & Git Flow 对于Github 一些好用的特殊操作技巧 ,可以见GitHub 特殊操作技巧 和Git的基本操作 一 GitHu ...
- 智能ERP 交接班统计异常的解决方法
请注意,有交接班统计数据不准确的需开启离线统计即可解决,交接班统计是按照结账时间来进行统计的 1.点击左侧导航栏中‘更多’-进入系统设置 2.进入营业设置后-开启离线统计-点击保存
- Spring MVC Spring中的Model (五)
完整的项目案例: springmvc.zip 目录 实例 项目结构: 配置web.xml <?xml version="1.0" encoding="UTF-8&q ...
- C# 实体/集合差异比较,比较两个实体或集合值是否一样,将实体2的值动态赋值给实体1(名称一样的属性进行赋值)
/// <summary> /// 实体差异比较器 /// </summary> /// <param name="source">源版本实体& ...