天天看点

weex在项目中的使用及遇到的坑

1.   在开发阶段编写xx.vue文件,xx.vue文件会被编译成 .js 格式的文件,然后Weex SDK会负责加载渲染这个js文件。在web 平台和 Native 平台,对 Virtual DOM 执行的解析方法不同。weex 是通过 webpack 打包出 bundle 文件的。bundle 文件的打包和 entry.js 文件的配置数量有关,默认情况下之后一个 entry 文件,自然也就只有一个bundle文件。具体实现步骤:

(1)在入口文件config.js添加路由和入口js,.temp编译后临时目录

         routerFilePath: 'router/routerXB.js',

         entryFilePath: 'entry/entryXB.js',

         templateDir: '.temp',

(2)webpack.common.conf.js中添引入口js  entry--->   entryXB.js

(3)src/entry中生成入口js文件   entryXB.js  ,引入routerXB.js

    const router = require('../router/routerXB');

(4)src/router中生成路由js    routerXB.js

(5)添加xb.vue页面

weex 比起react native,主要是在JS V8的引擎上,多了 JS Framework 承当了重要的职责,使得上层具备统一性,可以支持跨三个平台。总的来说它主要负责是:管理Weex的生命周期;解析JS Bundle,转为Virtual DOM,再通过所在平台不同的API方法,构建页面;进行双向的数据交互和响应。

2.问题总结

(1)<image style="width:170px;height:50px;" src=""></image> 图片要设置宽高才能显示