网友真实露脸自拍10p,成人国产精品秘?久久久按摩,国产精品久久久久久无码不卡,成人免费区一区二区三区

小程序模板網

釘釘Weex微應用與微信小程序對比表格

發布時間:2018-04-21 09:06 所屬欄目:小程序開發教程

程序構建

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


易優小程序(企業版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://www.xiuhaier.com/wxmini/doc/course/23829.html 復制鏈接 如需定制請聯系易優客服咨詢:800182392 點擊咨詢
QQ在線咨詢
AI智能客服 ×