weex体验报告
Posted 腾讯IMWeb前端团队
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了weex体验报告相关的知识，希望对你有一定的参考价值。
第一个问题： weex是啥？
官网：戳这里
A framework for building Mobile cross-platform UI
英语不好不知道这句话是什么意思，用google翻译了一下是：《一种用于构建移动跨平台的UI框架》，阿里百川出品。
第二个问题：TM哪里可以下载？
我也不知道，但是我是在 https://github.com/Laisly/weex 这里找到了这个，其实可以先不用管，不用下载这个也可以。后续当作weex的例子来看倒是挺好的。
第三个问题：怎么跑起来？
第一步：安装android运行环境
到这里下载安装 http://alibaba.github.io/weex/download.html 这里把二维码也偷过来，也可以扫这个，当然这个可能是旧的。
第二步：安装 weex-toolkit
npm install -g weex-toolkit
第三步：跑起来
- 新建一个文件比如 hello.we
<template> <div> <text style="font-size:100px;">Hello World.</text> <list> <cell repeat="{{items}}"> <text class="item">{{title}} ---- {{id}}</text> </cell> </list> </div> </template> <style> .item { font-size: 34px; height: 100px; } </style> <script> module.exports = { data: { items: [ {id: 1, title: 'Title Start'}, {id: 2, title: 'Title Title'}, {id: 3, title: 'Title Title'}, {id: 4, title: 'Title Title'}, {id: 5, title: 'Title Title'}, {id: 6, title: 'Title Title'}, {id: 7, title: 'Title Title'}, {id: 8, title: 'Title Title'}, {id: 9, title: 'Title Title'}, {id: 10, title: 'Title Title'}, {id: 11, title: 'Title Title'}, {id: 12, title: 'Title Title'}, {id: 13, title: 'Title Title'}, {id: 14, title: 'Title Title'}, {id: 15, title: 'Title End'} ] } } </script>
然后进入命令行执行，记得把命令行最大化。这个二维码有点大。
weex hello.we
打开weex Playground App 扫码。这时可能会出现两种情况
- 一种情况是成功： 不要扫这个二维码，扫了也没用
- 另一种情况是报错： 不要急，进入错误指示的位置union库的response-stream.js的第88行，添加代码,就OK了
if (method === 'setHeader') {
arguments[1] = encodeURIComponent(arguments[1]);
}
遇到的问题和感受。
- 千万不要调用
require('./weex-ui');调用这一句的后果就是极慢。 - 就是上面这个错误。
- 自动刷新还是蛮爽的。
- 这货据说是KPI产物，不知道后续会发展的怎么样？
- 目前只是试了android端，流畅度还是杠杠的。
- 这货和vue，riot有什么区别？简直一毛一样。
以上是关于weex体验报告的主要内容，如果未能解决你的问题，请参考以下文章