1.介紹
Nvue是一個基于weex改進的原生渲染引擎,它在某些方面要比vue更高性能,在app上使用更加流暢,但是缺點也很明顯,沒有足夠的api能力,語法限制太大,所以nvue適用于特定場景(需要高性能的區域長列表或瀑布流滾動等)。
nvue是uni-app App 端內置了一個基于 weex 改進的原生渲染引擎,提供了原生渲染能力,與vue在用法上稍有不同,不是使用uniapp開發app的話,就不要使用nvue
2.使用場景
- 層級問題
小程序和app-vue中,<map> 組件是由引擎創建的原生組件,它的層級是最高的,
不能通過 z-index 控制層級。在<map>上繪制內容,可使用組件自帶的marker、controls等屬性,
App端還可以使用plus.nativeObj.view 或 subNVue 繪制原生內容,參考。
另外App端nvue文件不存在層級問題。從微信基礎庫2.8.3開始,支持map組件的同層渲染,不再有層級問題。
也可以使用cover-view組件。
- 長列表渲染,,性能問題
app-nvue所有組件均為原生渲染,不存在前端組件無法覆蓋原生組件的問題。但為了保持多端兼容,nvue里也實現了cover-view,作用與普通view一樣。
在App端,如果重度使用video和map,推薦使用nvue頁面。
3.注意事項
- 新建得時候直接新建nvue頁面,不要把vue后綴直接更改nvue,否則可能會報錯
- 滿屏不能使用100%,使用flex:1,只支持flex布局
- text標簽一定要寫成一行
- 顯示文字,只能使用text標簽
- 給text設置字體大小或者文字顏色,給每一個text標簽設置,不能只給text標簽的父級設置大小和顏色,否則無效
- css樣式
只能使用類選擇器,并且不能組合嵌套
只能使用flex布局,默認全部容器均為 display: flex; flex-direction: column; - 不支持在css里寫背景圖background-image,但可以使用image組件和層級來實現類似web中的背景效果。因為原生開發本身也沒有web這種背景圖概念。