Weex和Vue
Weex 是阿里推送的一款基于Node.js,轻量级的移动端跨平台动态性技术解决方案,用于构建原生的速度的跨平台APP。
VueJs是一套构建用户界面的渐进式框架。Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。
¥19.90
¥99.00
购买须知?
本专栏为图文内容,最终完结不会低于15篇文章。
订阅博主任意付费专栏,享有该博主全部专栏一年阅读权限。
本专栏为虚拟产品,一经付款概不退款,敬请谅解。
xiangzhihong8
著有《React Native移动开发实战》、《Kotlin入门与实战》、《Weex跨平台开发与实战》、《React Native开发进阶》和《Flutter跨平台开发实战》,正努力完成《Android应用架构实战》
-
原创 Vite 2.0版本发布,都有哪些新特性
新年还没过完,Vite就发布了2.0版本,不得不佩服尤大大。Vite是什么Vite(法语意思是 “快”,发音为 /vit/,类似 veet)是一种全新的前端构建工具,你可以把它理解为一个开箱即用的开发服务器 + 打包工具的组合,但是更轻更快。Vite 利用浏览器原生的 ES 模块支持和用编译到原生的语言开发的工具(如 esbuild)来提供一个快速且现代的开发体验。Vite由两个主要部分组成:一个通过本机 ES 模块提供源文件的开发服务器,具有丰富的内置特性和快得惊人的热模块替换(HMR)。一2021-02-20 22:29:39147
0
-
原创 Vue开发的仿美团外卖Html5前端页面
今天给大家开源一个仿美团外卖的Vue项目,介绍Vue和vue-router的基本用法。工程结构工程目录结构比较简单,如下图所示。运行效果部分运行效果如下图,实现了基本的页面切换,导航菜单,购物车等功能。如何运行和其他的Vue项目一样,只需要下载源码,然后执行以下命令即可。npm installnpm run dev源码链接...2021-01-21 10:55:2075
0
-
原创 Vue开发仿京东商场app
vue3-jd-h5项目介绍vue3-jd-h5是一个电商H5页面前端项目,基于Vue 3.0.0 + Vant 3.0.0 实现,主要包括首页、分类页面、我的页面、购物车等,部分效果如下图。本地线下代码vue2.6在分支demo中,使用mockjs数据进行开发,效果图请点击这里master分支是线上生产环境代码,因为部分后台接口已经挂了????,可能无法看到实际效果。vue3搭建步骤首先,在本地选择一个文件,将代码clone到本地:git clone https:/2021-01-13 16:59:35153
0
-
原创 WEEX跨平台开发环境搭建
一、Weex简介大约两年前,为了写一本Weex的入门书籍,我花了几个月的时间学习了下Weex跨平台相关的知识。Weex 是阿里前端技术团队开源的一套跨平台开发方案,能以Web的开发体验构建高性能、可扩展的 Native 应用。简单来说,在集成了 WeexSDK 之后,开发者就可以使用 JavaScript 语言和前端开发经验来开发移动应用。Weex 渲染引擎与DSL语法层是分开的,Weex 并不强依赖任何特定的前端框架。Weex 应用的页面表示层使用Vue,并遵循 W3C 标准实现了统一的 JSEngi2020-12-16 19:23:26211
0
-
原创 《WEEX跨平台开发实战》出版啦
简介序言近年来,伴随着大前端概念的提出和兴起,移动端和前端的边界变得越来越模糊,一大批移动跨平台开发框架和模式涌现出来。从早期的PhoneGap、Inoic 等Hybrid技术,到现在耳熟能详的React Native、WEEX和Flutter等跨平台技术,无不体现着移动端开发的前端化。作为阿里巴巴开源的一套移动跨平台技术框架,WEEX框架最初是为了解决移动开发过程中频繁发版和多端研发的问题...2019-08-06 23:33:33798
0
-
原创 Weex开发之mask
mask弹层示例在移动开发中,我们经常会做一些弹框相关的东西,在Weex跨平台框架中,实现mask效果也比较简单。下面是示例效果:以下是示例代码:<template> <div> <div class="comment-btn" @click="showAd()"> <text class="comm...2019-02-01 11:19:04310
0
-
原创 Weex开发之地图篇
在移动应用开发中,地图是一个很重要的工具,基于地图的定位、导航等特点衍生出了很多著名的移动应用。在Weex开发中,如果要使用定位、导航和坐标计算等常见的地图功能,可以使用weex-amap插件。weex-amap是高德针对Weex开发的一款地图插件,在Eros开发中,Eros对weex-amap进行二次封装,以便让开发者更集成地图功能。和其他的插件一样,集成此插件需要在原生平台中进行集成。本文...2019-01-01 18:34:191736
0
-
原创 Weex Eros快速入门
概述随着Weex跨平台技术的持续火热,一时间涌现出了一大批基于Weex的开源解决方案,Weex Eros就是这么一个面向前端Vue的开源APP解决方案。目前,如果直接使用Weex框架开发应用会存在很多痛点,诸如初始化启动的环境问题、项目工程化问题、版本升级与版本兼容问题和不支持增量更新等,而Weex Eros等开源解决方案能对上述问题进行有效的解决。Weex Eros的定位不是组件库,而是基...2018-12-01 10:25:392763
0
-
原创 Weex 快速上手
“工欲善其事,必先利其器”,学习Weex之前需要先搭建好本地的开发环境,如果只是想简单的体验下Weex的魅力,可以使用Weex提供的dotWe在线运行环境,地址为“http://dotwe.org/vue”。安装依赖Weex官方提供weex-toolkit的脚手架工具来辅助开发和调试。不过需要先安装Node.js和Weex Cli相关的环境。安装Node.js安装Node.js有多种方式,...2018-11-02 09:53:39333
0
-
原创 Weex学习指南
近年来,伴随着大前端概念的提出和兴起,移动端和前端的边界变得越来越模糊,涌现了一大批移动跨平台开发框架和模式。从早期的PhoneGap、inoc等Hybird技术,到现在耳熟能详的React Native、Weex和Flutter等技术,无不体现着移动端开发的前端化。而阿里巴巴在2016年6月开源的Weex移动跨平台框架,语法上使用Vue.js编写,更加贴近Web前端开发,在性能和快速迭代方面,相...2018-08-30 11:06:291150
0
-
原创 移动跨平台Weex入门
Weex 是一个动态化的高扩展跨平台解决方案,也就是说开发人员只需要写一份代码就可以同时在移动端(Android端、iOS端)、Web端运行,这有别于React Native,从技术实现上也略有区别。下面是一张Weex的整体架构图。 从这张图我们可以发现,Weex 表面上是一个客户端技术,但实际上它串联起了从本地开发环境到云端部署和分发的整个链路。具体来说,开发者首先可以在本地像撰写...2018-05-18 18:23:19500
0
-
原创 WEEX环境搭建与入门
Weex简介Weex 是阿里前端技术团队开源额一套跨平台开发方案,能以web的开发体验构建高性能、可扩展的 native 应用,Weex 的页面表示层使用 Vue ,并遵循 W3C 标准实现了统一的 JSEngine 和 DOM API,Weex和React Native一样是当前流行的跨平台开发框架。Weex的官方地址为:https://weex.apache.org/。Weex最简单的方法...2018-04-18 18:36:563814
0
-
原创 适合前端Vue开发童鞋的跨平台Weex
基于 Vue 技术栈的你如果需要选用一种移动端跨平台框架,是 Weex?React-Native?还是Flutter? 无疑,相对于后两者,因为你现在已有比较熟练的 Vue 基础,如果在其他条件一致的情况,Weex 无疑是最佳选择;但是 Weex 真的适合在实际项目中进行移动端跨平台开发吗?Weex 的开发效率、Weex 的质量是否满足需求?一、开发环境在这个 Weex app 开发中,我的开...2019-10-15 22:56:39808
1
-
原创 Weex开发之WEEX-EROS开发踩坑
随着Weex跨平台技术的持续火热,一时间涌现出了一大批基于Weex的开源解决方案,Weex Eros就是这么一个面向前端Vue的开源APP解决方案。 目前,如果直接使用Weex框架开发应用会存在很多痛点,诸如初始化启动的环境问题、项目工程化问题、版本升级与版本兼容问题和不支持增量更新等,而Weex Eros等开源解决方案能对上述问题进行有效的解决。 Weex Eros的定位不是组件库,而是基于We...2019-08-25 09:17:19725
0
-
原创 mall4j开源商城
简介一个基于spring boot、spring oauth2.0、mybatis、redis的轻量级、前后端分离、防范xss攻击、拥有分布式锁,为生产环境多实例完全准备,数据库为b2b2c设计,拥有完整sku和下单流程的完全开源商城。Mall4j项目致力于为中小企业打造一个完整、易于维护的开源的电商系统,采用现阶段流行技术实现。后台管理系统包含商品管理、订单管理、运费模板、规格管理、会员管理...2019-07-31 10:08:271713
3
-
原创 Vue经典开源项目汇总
Vue.js(读音 /vjuː/, 类似于 view)是一套用于构建用户界面的渐进式框架,主要用于快速的构建前端界面,与其它大型的前端框架不同,Vue被设计为可以自底向上逐层应用。相比Angular.js来说,Vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合,是初创项目的前端首选框架。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用...2019-01-31 15:30:5711936
2
-
原创 移动跨平台技术方案总结
“得移动端者得天下”,移动端取代PC端,成为了互联网行业最大的流量分发入口,因此不少公司制定了“移动优先”的发展策略。为了帮助读者更好地学习WEEX,本节将对React Native、Weex和Flutter等主流的跨平台方案进行简单的介绍和对比。React NativeReact Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架,是Facebook早...2019-01-22 12:39:543941
1
-
原创 Weex开发之正确使用iconfont
最近,在使用Weex开发一款移动电商应用,期间需要用到大量的图标,不经意间想到了阿里的iconfont。那么我们如何使用iconfont呢?这里给大家简单介绍下iconfont的使用步骤:1、先进入iconfont官网http://www.iconfont.cn;2、新建一个图标项目,如下图:3、在自己的iconfont项目中查找,点击查看在线链接,如下图:4、点击【我的项目】,然后...2019-01-08 11:17:301172
0
-
原创 Mac安装weex-toolkit报错
这两天想使用weex集成weex-amap功能,结果怎么都装不上,于是安装官方文档重新装了一遍weex-toolkit,但是安装也是各种错误。于是我就想能不能卸载了weex-toolkit,再重新安装,发现还是不行。npm uninstall -g weex-toolkitnpm install -g weex-toolkit并且,我也尝试卸载node,发现也是不行的。于是我想到,默认...2018-12-28 18:28:57422
0
-
原创 WeexBox 快速上手
概述Weex是由阿里巴巴研发的一套移动跨平台技术框架,研发的初衷是为了解决移动开发过程中频繁发版和多端研发的问题。使用Weex提供的跨平台技术,开发者可以很方便的使用Web技术来构建高性能、可扩展的Native级别的性能体验,并支持在Android、iOS、YunOS和Web等多平台上进行部署。具体的说,当在项目中集成WeexSDK之后,就可以使用JavaScript和现代流行的前端框架来开发移...2018-12-21 11:44:14923
0
-
原创 Vue.js 3.0发布更新计划
在11月14日-16日于多伦多举办的 VueConf TO 2018 大会上,尤雨溪发表了名为 “ Vue 3.0 Updates ” 的主题演讲,对 Vue 3.0 的更新计划、方向进行了详细阐述。目前该演讲的 PPT 也已上传至 Google 文档,感兴趣的可点此查阅。本次版本主要围绕以下几个版本来升级:更快更小更易于维护更多的原生支持更易于开发使用…完整的ppt地址:htt...2018-11-19 11:35:135851
0
-
转载 企鹅电竞weex实践之UI篇
随着电竞业务的不断发展,页面功能越来越多,交互逻辑更加复杂,类似无限滚动、上拉刷新、横竖切换滚动等形式在业务中已是标配,经过重重优化后在H5中的体验一直达不到理想状态,没错,种种卡,H5的性能太差! 是持续优化还是破而后立选择新的技术方向呢?我们选择了更有效的后者。为什么选择weex相对H5来说,weex带来的用户体验更好,它结合了H5和Native各自的优势,既能像H5一样快速迭代,又能和N...2018-11-15 19:11:34705
0
-
原创 Vue.js 项目目录结构
Vue环境搭建和其他前端开发一样,Vue.js的开发环境也需要Node.js、npm和webpack等工具的支持。其中,Node.js 就是运行在服务端的JavaScript,npm是一个包管理工具,用来管理Vue.js项目所依赖的包,而webpack则是前端一个常用的模块化打包工具,它的作用就是将JavaScript代码或者其他静态文件进行分析和压缩,最终合并打包成浏览器可以识别的代码。安装...2018-10-21 18:52:001566
0
-
原创 Vue 入门之项目目录结构介绍
Vue 是一套用于构建用户界面的渐进式框架,与其它大型的页面框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。关于Vue环境搭建的内容,本文不再介绍,不清楚的同学可以访问Vue环境搭建或者查看官网相关内容的介绍: h...2018-05-20 18:10:235370
1
-
原创 Vue环境搭建
Vue.js是一个构架数据驱动的网页界面的渐进式框架,它的目标是通过尽可能简单的API实现响应的数据绑定和组合视图组件。它和Node、Angular并列为前端的三大框架。环境搭建在Mac中搭建Vue的开发环境会用到如下的一些工具额环境。 Homebrew node.js npm webpack Vue 1、安装brew,打开终端运行以下命令:/usr/bi...2018-03-20 11:15:251000
0
-
原创 移动PWA初探
在去年上海举办的2017谷歌开发者大会上,PWA作为会议的一个重要内容被推介,笔者作为参会嘉宾看了PWA的内容后,觉得这种技术会是未来移动发展的一个趋势。Google开发技术推广工程师Michael Yeung介绍称,新浪微博正在打造一款全新体验的Web Mobile PWA应用,读者可以通过微博提供的PWA版访问网址:m.weibo.cn/beta。 在当前的移动跨平台开发方案中,主要的技2018-01-26 15:28:132485
0
-
原创 实时消息传输协议(RTMP)详解
概述概念:RTMP协议从属于应用层,被设计用来在适合的传输协议(如TCP)上复用和打包多媒体传输流(如音频、视频和互动内容)。RTMP提供了一套全双工的可靠的多路复用消息服务,类似于TCP协议[RFC0793],用来在一对结点之间并行传输带时间戳的音频流,视频流,数据流。通常情况下,不同类型的消息会被分配不同的优先级,当网络传输能力受限时,优先级用来控制消息在网络底层的排队顺序。RTMP块流实时消息2017-03-30 22:31:344604
0
-
原创 hibernate 5.2.6新特性
概述Hibernate ORM 5.2.6 发布了,Hibernate是一种Java语言下的对象关系映射解决方案。 它是使用GNU宽通用公共许可证发行的自由、开源的软件。它为面向对象的领域模型到传统的关系型数据库的映射,提供了一个使用方便的框架。 Hibernate ORM 5.2.6 发布不到一个月,网上关于Hibernate ORM 5.2.6 的资料甚少,这里我们只能借助官网的介绍来做一个简2017-01-07 10:39:159887
3
-
原创 使用Apache的ab进行压力测试
概述ab是apache自带的压力测试工具,当安装完apache的时候,就可以在bin下面找到ab然后进行apache 负载压力测试。后台测试开发中,常用的压力测试服务,php一般选择xampp,下载地址:点击打开链接,java后台,如果你选用apache,apache http自带了ab压力测试工具,地址:点击打开链接。下面以apache http server介绍ab压力测试。安装下载:http2016-12-02 14:06:249254
0
-
原创 Spring Boot微服务架构入门
概述还记得在10年毕业实习的时候,当时后台三大框架为主流的后台开发框架成软件行业的标杆,当时对于软件的认识也就是照猫画虎,对于为什么会有这么样的写法,以及这种框架的优势或劣势,是不清楚的,Spring中的AOP(面向切面编程)机制在软件开发中是很好的应用。一方面使开发业务逻辑更清晰、专业分工更加容易进行。另一方面就是应用Spirng AOP隔离降低了程序的耦合性使我们可以在不同的应用中将各个切面2016-11-25 22:40:083568
0
-
原创 spring Boot 配置文件详解
概要 前面我们讲述了如何搭建一个简单的 spring Boot 应用(参见Spring Boot - 初探),这里,我们来学习如何对项目进行相关的配置,包括系统构建、自动配置、依赖注入、开发工具等,使其更好地运行。系统构建 为了便于依赖管理,官方建议我们使用Maven或者Gradle,以便进行依赖管理。当然,Spring Boot 也支持其他系统构建方式(如Ant)。2016-11-25 22:43:334924
0
-
转载 Spring+SpringMVC+MyBatis整合
1、基本概念1.1、Spring Spring是一个开源框架,Spring是于2003 年兴起的一个轻量级的Java 开发框架,由Rod Johnson 在其著作Expert One-On-One J2EE Development and Design中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。Spring使用基本的JavaBean来完成以前只可能由EJ2016-11-09 09:34:452322
1
-
原创 手机直播连麦技术分析
直播火了,连麦直播也火了,那么说明是直播,连麦直播是什么。手机直播连麦功能的特点,我们按下面三部分来聊一聊手机直播和直播连麦:手机直播连麦功能的特点人物画像和设计思维一个有趣的连麦功能交互建议手机直播连麦功能的特点体验了斗鱼、NOW直播、美拍直播、淘宝直播、新浪直播、映客、me直播等直播平台、发现只有映客和me直播推出了手机直播的连麦功能。我们从以下三点来展开分析直播连麦的特点:连麦功能的权限连麦2016-11-02 17:27:4218255
2
-
原创 Spring boot之hello word
环境准备一个称手的IDE(首选Myeclipse,也可以选Eclipse)Java环境(JDK 1.7或以上版本)Maven 3.0+(Eclipse和Idea IntelliJ内置,如果使用IDE并且不使用命令行工具可以不安装)一个最简单的Web应用使用Spring Boot框架可以大大加速Web应用的开发过程,首先在Maven项目依赖中引入spring-boot-starter-web:pom2016-09-15 11:00:061109
0
-
原创 老司机带你玩转web service
当大型需求被数个公司分割开来,各公司系统相互交换数据的问题就会接踵而来。毕竟是多家不同的公司的产品,研发开发语言、采用技术框架基本上是百花齐放。怎样让自家系统提供的服务具有跨平台、跨语言、跨各种防火墙,让其他公司的研发用起来没障碍和爽呢?进过前期的技术调研和实践,最终将目光放在了轻量级 webService 服务上面 1. WebService 服务技术的关键点XML: 做为 WebSer2016-09-10 13:58:222031
2
-
原创 天下网上系统使用及介绍
源码我已经放在git上了,有需要的可以到https://github.com/xiangzhihong/B2CShop系统介绍本章的天下陶网络商城主要分为:前台游客浏览、普通用户操作和后台管理3部分。结合目前网上购物平台系统的设计方案,本项目具有以下特点:界面设计美观大方、操作简单。功能完善、结构清晰。普通用户的购物操作。能够实现后台用户和商品管理。能够实现推荐商品的操作。2016-03-10 12:27:402768
0
-
原创 为什么我们要使用ssh框架技术,及感想
前言: 在公司从C++转向Java Web方向大概有3个月(11月初-1月底)了。三个月前对Java和Web还几乎是零基础。然后从安装Eclipse,MySQL,tomcat开始,到学习HTML/CSS/Javascript,JQuery,JSP,SQL,在项目已有的架构Spring-Struts-Hibernate上,开始加入新的功能页等。这三个月,写了很多的JavaScrip2016-03-10 09:02:359101
1
-
原创 Android+struts2+json方式模拟手机登录功能
涉及到的知识点: 1.Struts2框架的搭建(包括Struts2的jSON插件) 2.Android前台访问Web采用HttpClient方式。 3.Android采用JSON的解析。服务端主要包含一个Action,通过struts的web配置配置struts.xml驱动业务逻辑的执行,然后对于符合条件的登录,返回给客户端通过jsonobject包装的数据。2016-03-14 15:28:195940
0
-
原创 Myeclipse Db Browser使用
1.打开Myeclipse,选择菜单栏Window-->Show View-->Other,展开MyEclipse Database,选择DB Browser,打开数据库浏览视图2.空白处右键-->NEW,按图配置,Driver Name是自己随便取个名字,连接字符串这里以SQLServer 2008为例,databaseName是数据库名字,数据库连接驱动ja2016-06-01 11:45:003638
0
-
原创 仿12306查询火车票功能
首先感谢http://www.zuidaima.com/share/1861712958622720.html对我的帮助,我在此基础上修改了页面的显示,先上效果吧public class SearchTrainController implements X509TrustManager{ private static String QUERY_RUL = "https://kyfw.2016-04-11 18:52:357559
4