258资源分享网

程序构建 weex微应用 微信小程序
通过webpack打包构建成一个纯JavaScript文件，需要开发者自己写打包脚本，非常灵活。   通过IDE打包，打包路径是一个黑盒，不需要开发者写打包脚本，必须按照它的规则书写入口以及业务代码。  
代码包无限制大小   限制大小2M  
无配置文件   需要入口配置文件来配置页面必须依赖的Path  
应用设计指南 weex微应用 微信小程序
无   包含了视觉，交互等常规设计 微信小程序设计指南  
应用接入指南 weex微应用 微信小程序
有，但是很分散   包含了应用接入指南主体 微信小程序接入指南  
数据 weex微应用 微信小程序
无   可查看运营数据 小程序数据助手，这是发布平台的一部分  
开发者社区支持 weex微应用 微信小程序
有，太分散，weex主要在https://segmentfault.com/t/weex ， Vue的问题在https://github.com/vuejs/vue/issues   开发者社区  
无   量身打造的 UI 组件库https://github.com/Tencent/weui-wxss  
无   量身打造的设计库https://github.com/weui/weui-design  
开发者数量少，百度或google搜索出来的信息量少   开发者众多，问题能搜索出来  
IDE集成开发环境 weex微应用 微信小程序
无   有提供IDE集成开发环境，包括调试，发布等环节。  
调试需使用weex-toolkit   调试集成在IDE中  
调试分为Debugger和Inspector，只允许单独使用一种   在IDE面板中既可以Debug也可以inspector还有网络请求等等可查看  
如果要调试需要额外安装 weex-debug   不需要  
如果要分析性能依赖Safari   提供简单易用的性能分析工具  
编辑器随意，如果要着色，提示，需要开发者自己找插件   集成在IDE中提供诸如智能提示，代码着色等  
无法实时预览   可以实时预览  
钉钉js-api需要依赖钉钉客户端模拟器包   无需，已经模拟实现大部分api  
无发布平台   IDE可以发布，将小程序代码上传到微信小程序后台  
无   IDE有更多细节功能，可参考：uplog  
文件组织 weex微应用 微信小程序
通过vue单组件的方式组织，也可以使用render的方式，完全取决于开发者   wxml wxss js的方式 ，开发者不可控  
Vue构造函数   App Page  
生命周期 weex微应用 微信小程序
每一个组件都有自己独立的生命周期   Page 才有，并且一个页面只能有一个Page  
Vue的生命周期方法   onLoad ... 之类 Page  
一个完整的应用，比如钉钉客户端在后台，应该注册在 入口文件中   在App中 App，并且一个完整的小程序只允许有一个App，可以包含多个Page，一个Page代表一个完整的页面，且小于等于5  
页面跳转 weex微应用 微信小程序
可以使用vue-router或者openLink跳转bundle.js，等等...   只有一种路由模块 路由  
数据绑定 weex微应用 微信小程序
逻辑判断：v-if="x"   wx:if="{{x}}"  
数据绑定：<div> {{ message }} </div>   <view> {{ message }} </view>  
属性赋值：class="id"   class="{{ id }}"  
运算： :class="[id ? 'a': 'b']"   class="{{ id ? true : false }}"  
数组： <div v-for="item in items">{{ item }}</div>   <view wx:for="{{ items }}>{{ item }}</view>"  
对象：使用计算属性 或 data="foo"   data="{{foo, bar}}" object: data:{foo: 'my-foo',bar: 'my-bar'}  
Vue 语法皆可支持...N   无  
列表渲染 weex微应用 微信小程序
数组： <div v-for="item in items">{{ item }}</div>   <view wx:for="{{ items }}>{{ item }}</view>"  
对象迭代： <div v-for="item in objects">{{ item }}</div>   无  
获取索引：<div v-for="(item,index) in items">{{ index }} {{ item }}</div>（item的命名可以随便换）   <div wx:for="{{ items }}">{{index}} {{ item }}</div>（需要使用wx:for-index或者wx:for-item修改）  
唯一标识 <div v-for="item in items" :key="item.id"></div>   <view wx:for="{{ items }}" wx:key="{{ item.id }}"></view>  
Vue 还有很多其他的处理方式，详细查看列表渲染   无  
条件渲染 weex微应用 微信小程序
v-if="admin"   wx:if="{{ admin }}"  
包装元素： <template v-if="ok"><.../></template>   <block wx:if="{{ ok }}"></block>  
else if and else：<div v-if="le > 5 "></div><div v-else-if="le > 2"></div><div v-else></div>   <view wx:if="{{length > 5}}"> 1 </view><view wx:elif="{{length > 2}}"> 2 </view><view wx:else> 3 </view>  
Vue支持的更多，详细查看 条件渲染，且v-show指令在weex中不支持   无  
事件 weex微应用 微信小程序
@click="handler"或者v-on:click="handler"   bindtap="handler"  
不支持冒泡   支持冒泡  
事件对象为 weex构建   事件对象支持touch event  
文件引用 weex微应用 微信小程序
支持ES import 或者 require，决定权在于开发者   只允许import 或者 include，决定权在于微信  
组件级别的支持   模板载入 include  
样式 weex微应用 微信小程序
只支持单组件 或者 style in Js 需要额外处理，文件怎么组织和引用完全的决定权在于开发者   允许使用 @import 来组织样式  
只支持class   支持 class id element ::after ::befor  
不支持全局样式   支持全局样式  
支持内联样式   同样支持  
基于750像素开发   基于 rpx 单位开发，建议使用iPhone6视觉稿为基准  
布局只能使用flexbox   都支持  
支持少数的样式   大部分都支持取决于你的设备  
组件 weex微应用 微信小程序
容器组件 div scroller list   view scroll-view swiper movable-area  
文本显示需要依赖text,texttarea   不需要text组件也可以显示文本，本身也有text组件,texttarea  
开关组件 switch   switch,checkbox,radio  
轮播 slider,indicator   slider 是滑动选择器  
媒体 video, image   audio,video,image  
input   input  
浏览器 web   无  
无   icon  
无   contact-button 客服会话  
无   map 地图  
gcanvas依赖第三方插件   canvas  
无   navigator  
无   picker-view，picker,label,form,button,progress  
其他组件 cell, loading,refresh,waterfall,a   无  
功能 weex微应用 微信小程序
钉钉js-api，weex自带的module，第三方插件的module   微信小程序js-api