wexx / nvue
最后更新于:2022-04-02 03:40:51
[TOC]
> [wexx 文档](https://weex.apache.org/zh/docs/styles/common-styles.html#%E7%9B%92%E6%A8%A1%E5%9E%8B)
## 概述
1. 可以提供原生渲染能力
2. 可以使用所有`weex`的内置组件和内置模块
3. 只有 文件后缀为`.nvue` ,只有 app 端才会编译
4. nvue 相当于 weex + plus + uni-app api
5. 如果你是web前端,不熟悉 weex,那么建议你仍然以使用 vue 为主
## 支持的 api
* weex API :使用前需先引入对应模块,参考:[weex 内置模块](http://weex-project.io/cn/references/modules/index.html)
* uni API:nvue可以使用部分 uni API,详细支持列表请参照:[nvue 里可使用的 uni-app API](https://uniapp.dcloud.io/use-weex?id=nvue-%e9%87%8c%e5%8f%af%e4%bd%bf%e7%94%a8%e7%9a%84-uni-app-api)
* plus API:在自定义组件编译模式下,nvue里可直接使用plus API
## 调试 nvue 页面
[参考方法](https://uniapp.dcloud.io/use-weex?id=_3-%e8%b0%83%e8%af%95-nvue-%e9%a1%b5%e9%9d%a2)
## 生命周期
| Vue 生命周期钩子 | 说明 |
| --- | --- |
| beforeCreate | 在实例初始化之后,数据观测 (data observer) 和 event/watcher 事件配置之前被调用 |
| created | 在实例创建完成后被立即调用 |
| beforeMount | 在挂载开始之前被调用 |
| mounted | el 被新创建的 vm.$el 替换时调用 |
| beforeUpdate | 数据更新时调用 |
| updated | 页面元素更新后调用 |
| beforeDestroy | 实例销毁之前调用 |
| destroyed | 实例销毁后调用 |
| errorCaptured |
## nvue 和 vue 相互通讯
1. 在`nvue`使用`uni.postMessage(data)`发送数据通讯,`data`为`JSON`格式(键值对的值仅支持String)。
2. 在`App.vue`里使用`onUniNViewMessage`进行监听
## vue 向 nvue 通讯
[参考](https://uniapp.dcloud.io/use-weex?id=vue-%e5%90%91-nvue-%e9%80%9a%e8%ae%af)
## nvue 中使用 weex 第三方库
```
npm init -y
npm i weex-ui -S
```
使用
```
```
## nvue 里使用 BindingX
[BindingX](https://alibaba.github.io/bindingx/)
`npm install weex-bindingx --save`
## 注意事项
* nvue 不支持 vue 里的 vuex
目前不支持在 nvue 页面使用 scss、less 等预编译语言。
nvue 中不支持使用 import 的方式引入外部 css, ``
';