前端组件

相信tab切换对于大家来说都不算陌生，后台管理系统中多会用到。如果不知道的话，可以看一下浏览器上方的标签页切换，大概效果就是这样。 1.如何切换 使用动态组件,相信大家都能看懂（部分代码省略） //通过点击就可以实现两个组件来回切换 <button @click="changeView">切换view</button> <component :is="currentView"></component> import pageA from "@/views/pageA"; import pageB from "@/views/pageB"; computed: { currentView(){ return this.viewList[this.index]; } }, methods: { changeView() { this.index=(++this.index)%2 } } web前端开发学习Q-q-u-n： 784783012 ，分享学习的方法和需要注意的小细节，不停更新最新的教程和学习方法 （详细的前端项目实战教学视频，PDF） 注：这个多用于单页下的几个子模块使用，一般切换比较多使用下面的路由 使用路由（这个就是配置路由的问题了，不作赘述） 2.动态生成tab 一般UI框架给我们的tab切换都像是上面的那种，需要自己写入几个tab页之类的配置

前言 今天来聊一下前端必备技能—— 小程序开发 。 从最早发布的 微信小程序 ，到后来的 支付宝小程序 、 字节跳动小程序 、 百度小程序 、 QQ小程序 ，还有最近发布的 360小程序 ，面对这么多套的代码，开发者该如何开发呢？ 当业务要求同时在不同的端都要展现时候，针对不同的端去编写多套代码的成本显然非常高。 这时候只需编写一套代码，就能够适配多端的能力就显得尤为需要。 今天就来给大家介绍一款，使用 Vue 的跨端框架—— uni-app uni-app 框架简介 uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，可编译到 iOS 、 Android 、 H5 、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等平台。 uni-app 在 开发者数量、案例、跨端抹平度、扩展灵活性、性能体验、周边生态、学习成本、开发成本 等 6 大关键指标上拥有极强的竞争优势： 开发者/案例数量更多 跨端抹平度/扩展灵活性(通过条件编译，调用专有能力而不影响其他平台) 性能体验更优秀( App 端支持 weex 渲染，带来更流畅的用户体验。) 周边生态丰富(推出 插件市场 ，能够提供较多的组件和模板，真正做到开箱即用) 学习成本低(采用 Vue.js 语法 + 小程序 API ) 开发成本低(不止开发成本，招聘、管理、测试各方面成本都大幅下降。)

前言 关于 FlutterGo 或许不用太多介绍了。 如果有第一次听说的小伙伴，可以移步 FlutterGo官网 查看下简单介绍. FlutterGo 在这次迭代中有了不少的更新，笔者在此次的更新中，负责开发后端以及对应的客户端部分。这里简单介绍下关于 FlutterGo 后端代码中几个功能模块的实现。 总体来说，FlutterGo 后端并不复杂。此文中大概介绍以下几点功能（接口）的实现： FlutterGo 登陆功能 组件获取功能 收藏功能 建议反馈功能 环境信息 阿里云 ECS 云服务器 Linux iz2ze3gw3ipdpbha0mstybz 3.10.0-957.21.3.el7.x86_64 #1 SMP Tue Jun 18 16:35:19 UTC 2019 x86_64 x86_64 x86_64 GNU/Linux mysql ： mysql Ver 8.0.16 for Linux on x86_64 (MySQL Community Server - GPL) node: v12.5.0 开发语言： midway + typescript + mysql 代码结构： src ├─ app │ ├─ class 定义表结构 │ │ ├─ app_config.ts │ │ ├─ cat.ts │ │ ├─ collection.ts │ │ ├─ user

Vue Cli项目搭建 vue项目需要自建服务器：node 什么是node： 用C++语言编写，用来运行JavaScript语言 node可以为前端项目提供server (包含了socket) 一、环境搭建 1、官网下载安装包，傻瓜式安装： https://nodejs.org/zh-cn/ 2、装完了后在cmd输入node即可启动一个命令行交互环境，运行javascript代码 3、可以更换国内源，加速下载：npm install -g cnpm --registry=https://registry.npm.taobao.org 在更换源后，所有的npm命令都可以替换为cnpm。 改完后npm的源还是国外的源，cnpm的源是淘宝的源。 4、安装vue cli环境：脚手架，命令行快速创建项目 cnpm install -g @vue/cli 5、安装脚手架报错的时候，需要清空缓存处理 npm cache clean --force 二、项目创建 以管理员的身份运行cmd ，否则可能出现一些不必要的麻烦 首先cd切换到目标目录 执行：vue create 项目名 选择自定义方式创建项目，选取Router, Vuex插件 选择第二个进入自定义配置： 5. 执行时，会提示下载源，选择淘宝镜像即可。（有大写的选大写，大写是建议的选项） 6. 具体配置：上下键切换，空格键选择

Vue.js是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。 实用的 Vue.js组件库可以帮助我们快速搭建页面，下面介绍小编认为比较受欢迎的五个vue前端ui框架。 TOP5——Vue-Blu Vue-Blu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。全面、灵活且强大的ui组件，API友好。 TOP4——vue-strap 基于 Vue.js 的 Bootstrap 组件 该仓库包含一系列基于 Bootstrap 标记和 CSS 的本地 Vue.js组件，喜欢bootstrap的小伙伴可以快速上手。 TOP3——vuetify V 1.0 Alpha 版本提供了超过 80个 reusbale 组件，其中包含一个易于记忆的语义设计，它基于名称简单明了 type-as-you 的类型属性。 在GitHub 上有超过 7K 的 star。 TOP2——iView iView 是一套基于 Vue.js 的开源 UI 组件库，主要服务于 PC 界面的中后台产品。 使用单文件的 Vue 组件化开发模式 基于 npm + webpack + babel 开发，支持 ES2015 高质量、功能丰富 友好的 API ，自由灵活地使用空间，由TalkingData开发维护。

在前端项目开发过程中，总是会引入一些UI框架，已为方便自己的使用，很多大公司都有自己的一套UI框架，下面就是最近经常使用并且很流行的UI框架。 一.Mint UI 屏幕快照 2019-01-18 下午3.03.59.png Mint UI是 饿了么团队开发基于vue .js的移动端UI框架，它包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。 官网： https://mint-ui.github.io/#!/zh-cn Github: https://github.com/ElemeFE/mint-ui/ 二. WeUI WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。包含button、cell、dialog、toast、article、icon等各式元素。 官网地址： https://weui.io/ Github: https://github.com/weui/weui.git 三. cube-ui cube-ui 是滴滴团队开发的基于 Vue.js 实现的精致移动端组件库。支持按需引入和后编译，轻量灵活；扩展性强，可以方便地基于现有组件实现二次开发。 官网地址： https://didi.github.io/cube-ui/#/zh-CN Github: https:/

参与微信小程序开发有一段时间了，先后完成信息查询类和交易类的两个不同性质的小程序产品的开发；期间遇到各种各样的小程序开发的坑，有的是小程序基础功能不断改进完善而需要业务持续的适配，有的是小程序使用上的一些坑；下面针对小程序开发过程中遇到的一些坑跟大家分享，有些没有深究具体原因； 1、原生组件遮盖的问题 由于原生组件层级最高，即使设置了其 z-index 也于事无补；不能随意在其层级上展示信息，只能通过 cover-view 和 cover-image 组件(其实这两个组件也是原生组件)来进行遮盖； 例如,下图在map原生组件上遮盖层：上方banner、地图上的气泡指针以及右下角的归位。 另外需要注意一点，若要在覆盖原生组件上，还需要保证一点： 由于`cover-view`和`cover-image`也是原生组件，需要保证他们插入页面的时机晚于要覆盖的原生组件，即先要插入原生组件。 例如上图中，地图上的banner遮盖层若不是包含在map原生组件内，那么就需要在map出现后插入，否则map组件也会覆盖cover-veiw 2、不支持base64格式的图片问题 小程序有些图片是不支持base64格式的，例如 cover-image ，地图marker的 iconPath 等。在配合webpack构建小程序代码时需要注意不要对这些图片进行base64转换。 3

开发微信小程序的过程中，选择一款好用的组件库，可以达到事半功倍的效果。自从微信小程序面世以来，不断有一些开源组件库出来，下面6款就是排名比较靠前，用户使用量与关注度比较高的小程序UI组件库。还没用到它们的你，可以关注和了解一下哦！ WeUI WXSS WeUI WXSS是腾讯官方UI组件库WeUI的小程序版，提供了跟微信界面风格一致的用户体验。 GitHub地址： https://github.com/Tencent/weui-wxss npm下载： npm i weui-wxss iView WeApp iView是TalkingData发布的一款高质量的基于Vue.js组件库，而iView weapp则是它们的小程序版本。 GitHub地址： https://github.com/TalkingData/iview-weapp npm下载： npm i iview-weapp ZanUI WeApp ZanUI WeApp是有赞移动 Web UI 规范 ZanUI 的小程序实现版本，结合了微信的视觉规范，为用户提供更加统一的使用感受。 现已包含 badge、btn、card、cell、dialog、icon、label、noticebar、panel、popup、switch、tab、toast、tooltips 等组件或元素。 GitHub地址： https://github

java 三层架构ssh 一个spring2.5+hibernate3.2+struts2.0组合框架，使用spring 的 IoC来管理应用 的 所有bean，包括struts2 的 action，充分发挥了spring轻量级框架 的 优势。 摘 要: 针对当前Web应用程序开发面临的问题，结合目前比较流行的开源框架Spring、Struts和Hibernate，提出了一种开发J2EE Web应用的轻量级解决方案，以帮助开发人员在短期内搭建结构清晰、可复用性好、维护方便的Web应用程序。并且，通过案例具体说明了如何将这一方案应用到实际项目中。 关键词: J2EE MVC Struts Spring Hibernate 大型企业级Web应用系统的开发通常要求有一个良好的软件架构、便于协作开发和扩展升级，而传统的开发模式不能很好地满足这些要求。本文针对当前Web应用程序开发面临的问题，结合目前比较流行的开源框架SSH（Spring、Struts、Hibernate)，提出一种开发J2EE 企业级Web应用的轻量级解决方案，并通过案例具体说明如何将这一方案应用到实际项目中。 1 框架技术 著名的软件大师Ralph Johnson对框架(Framework)进行了如下的定义： 框架是整个系统或系统的一部分的可重用设计，由一组抽象的类及其实例间的相互作用方式组成[1] 。

前言 本文以前端面试官的角度出发，对 Vue 框架中一些重要的特性、框架的原理以问题的形式进行整理汇总，意在帮助作者及读者自测下 Vue 掌握的程度。 本文章节结构以从易到难进行组织，建议读者按章节顺序进行阅读，当然大佬级别的请随意。 希望读者读完本文，有一定的启发思考，也能对自己的 Vue 掌握程度有一定的认识，对缺漏之处进行弥补，对 Vue 有更好的掌握。文章最后一题，欢迎同学们积极回答，分享各自的经验 ~~~ 1、说说你对 SPA 单页面的理解，它的优缺点分别是什么？ SPA（ single-page application ）仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成，SPA 不会因为用户的操作而进行页面的重新加载或跳转；取而代之的是利用路由机制实现 HTML 内容的变换，UI 与用户的交互，避免页面的重新加载。 优点： 用户体验好、快，内容的改变不需要重新加载整个页面，避免了不必要的跳转和重复渲染； 基于上面一点，SPA 相对对服务器压力小； 前后端职责分离，架构清晰，前端进行交互逻辑，后端负责数据处理； 缺点： 初次加载耗时多：为实现单页 Web 应用功能及显示效果，需要在加载页面的时候将 JavaScript、CSS 统一加载，部分页面按需加载； 前进后退路由管理：由于单页应用在一个页面中显示所有的内容