进击的weex 第二发 weex的各种坑

各种错误处理

1.错误:ReferenceError: global is not defined

使用stream模块发送请求时报错。

clipboard.png

解决办法
把下面代码放入app.js中

if (weex.config.platform == 'Web') {
  if(window && !window.global) { // Stream.fetch jsonp调用失败,原因是找不到global
    window.global = window;
  }
}

2.错误:weex is not defined
解决办法
命令行中执行 npm install [email protected] --save
然后检查weex.html里这句<script src="./node_modules/weex-vue-render/index.js"></script>
修改为<script src="./node_modules/weex-vue-render/dist/index.js"></script>

3.weex.config.platform判断平台失败(undefined)???
解决办法

// 输出 Web Android iOS
console.log(weex.config.platform || weex.config.env.platform);
         

4.web可以接受jsonp的返回数据 app不行
web
clipboard.png
app
clipboard.png
解决办法
后端检验reffer,然而web有这个,app没有。。。所以让他们去掉就好了~

5.setRefreshOrLoading: HostView == null !!!!!! check list attr has append =tree

clipboard.png
解决办法
还没解决。。。。

全平台篇

  • 不支持class嵌套(得跟sass,less,precss说拜拜啦~)

  • 只支持px长度单位(跟%,rem,em等等也得说拜拜啦~)

  • color最好写成#000,#000000,black这种形式
    rgb(a,b,c) 或 rgba(a,b,c,d) 的性能比其他颜色格式差很多

  • css属性(border margin padding background 等等) 不可简写
    错误的写法-> border: 1 solid #ff0000;margin: 0 auto;

  • 默认盒模型为flex,box-sizing 默认为 border-box

  • <image>组件暂不支持本地图片,需指明width和height否则无法显示

  • background-image需要使用<image>组件和position定位来现实

  • background-image 优先级高于 background-color,这意味着同时设置 background-image 和 background-color,background-color 被覆盖。

  • 不支持z-index但靠后的元素层级更高

  • Weex 支持四种伪类:active, focus, disabled, enabled
    所有组件都支持 active, 但只有 input 组件和 textarea 组件支持 focus, enabled, diabled。

Web篇

  • 各种不能在app上正常显示的 大多都能在web上被支持- -!!

iOS篇

  • 支持 9 种 font-weight值
    (normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900)

  • 不支持webp 用jpg吧~

  • image组件不可省略写成img标签

  • <image> 组件上尚无法只定义一个或几个角的 border-radius。比如你无法在这两个组件上使用 border-top-left-radius。

Android篇

  • 不支持gif

  • font-weight值仅支持 400(normal) 和 700(bold)

  • 如果定位元素超过容器边界,在 Android 下,超出部分将不可见,原因在于 Android 端元素 overflow 默认值为 hidden,但目前 Android 暂不支持设置 overflow: visible。

猜你喜欢

转载自www.cnblogs.com/homehtml/p/12902180.html
今日推荐