weex 阶段总结
新年伊始,回顾过去的一年,收获很多,之前一直在研究weex,说心里话感觉心好累,官方文档不全,社区不活跃,遇到很多坑,官方发布的版本有时都有坑,搞得我都不敢更新版本了。
但是,研究了这么久,放弃太可惜,唉,只能抱着相信尤大大能将 weex 打造成 vue 一样的想法一直走下去。
1.weex 默认适配尺寸
weex默认使用750px * 1334px作为适配尺寸, 实际渲染时由于浮点数的误差可能会存在几px的误差, 出现细线等样式问题, 可以通过加减几个px来调试
iPhone界面尺寸

注:style上需要添加 scoped,否则无法自动适配。
2.navigator 页面跳转
示例一:
<script>
var navigator = weex.requireModule('navigator')
var modal = weex.requireModule('modal')
export default {
methods: {
jump (event) {
console.log('will jump')
navigator.push({
url: 'http://dotwe.org/raw/dist/519962541fcf6acd911986357ad9c2ed.js',
animated: "true"
}, event => {
modal.toast({ message: 'callback: ' + event })
})
}
}
};
</script>
示例二:
function isWeex () {
return process.env.COMPILE_ENV === 'weex' // 需要在webpack中自定义
}
export default {
methods: {
push (path) {
if (isWeex()) {
const toUrl = weex.config.bundleUrl.split('/').slice(0, -1).join('/') + '/' + path + '.js' // 将a.js的绝对地址转为b.js的绝对地址
weex.requireModule('navigator').push({
url: toUrl,
animated: 'true'
})
} else {
this.$router.push(path) // 使用vue-router
}
},
pop () {
if (isWeex()) {
weex.requireModule('navigator').pop({
animated: 'true'
})
} else {
window.history.back()
}
}
}
}
.
weex 阶段总结的更多相关文章
- 第八章 交互技术,8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障(作者:鬼道)
8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障 前言 Native 开发的诸多亮点中,流畅体验和系统调用是最多被提及的.流畅体验体现在页面滚动/动画的流畅性,背后是更好的内存管理和更接近 ...
- Weex详解:灵活的移动端高性能动态化方案
原文地址:http://www.infoq.com/cn/articles/introducing-weex 在2016年4月份的QCon上,阿里巴巴资深总监,淘宝移动平台及新业务事业部.阿里百川负责 ...
- weex入门
近期要做一个安卓端的原生应用程序.情况是这样的:需求方原先已经实现了网页,是一个工具类应用,大致作用是连接到他们公司生产的硬件,然后通手机与智能硬件通信来对硬件进行一系列控制.不过呢,这个网页先前是由 ...
- Weex入门指南
背景 由于公司项目需要,需求变化频繁,计划总改不上变化,由于app更新版本周期长,不能很好应对这种变化,正在此前提下热修复和热更新技术也有了发展的空间,不管热修复还是热更新,都是对app内容或者逻辑的 ...
- 阿里巴巴开源前端框架--Weex实践
Weex是最近很火很NB的一个技术产品,因为本篇介绍的是怎样使用Weex的最佳实践,所以就不罗里吧嗦的夸它怎么怎么好了,感兴趣的可以访问Weex HomePage,或加入旺旺群:1330170019. ...
- Weex 初探
Weex 初探 Weex 介绍 Weex 是阿里于 2016 年开源的一款开发框架,它的介绍是: Weex 是一个使用 Web 开发体验来开发高性能原生应用的框架. 它使用了 Web 技术来开发 An ...
- 移动端跨平台方案对比:React Native、weex、Flutter
跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架百花齐放,颇有一股推倒原生开发者的势头. 为什么我们需 ...
- WEEX入坑指南(1)
weex create newtest 然后在某个阶段卡死, 解决方案: 在路径下创建新建文件夹,并命名为项目的名称.
- 最火移动端跨平台方案盘点:React Native、weex、Flutter
1.前言 跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架的百花齐放,颇有一股推倒原生开发者的势头. ...
随机推荐
- day23 02 组合(继续人狗大战游戏)
day23 02 组合(继续人狗大战游戏) 面向对象的三大特性:继承 多态 封装 先讲解一下组合 组合:一个对象的属性值是另一个类的对象:对象.属性.属性(一般有两个点) 继续扩展day22 01里面 ...
- python基础学习笔记——深浅拷贝
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 lst1 = ["⾦⽑狮王", "紫衫⻰王&qu ...
- 使用 RMAN 同步数据库
使用 RMAN同步数据库 使用 RMAN 同步数据库 一.概述 二 操作步骤 (一).把生产库置为归档模式 (二).启动rman做数据库0级备份 (三).修改生产库数据库到未归档 (四).拷贝备份集到 ...
- Exchange 正版化 授权
网友说法: Exchange服务器版其实价格不高,企业版也就是几万左右,贵的是客户端授权,一个客户端授权大概要300多.但是,但是,中国企业买Exchange客户端一般都是可以按比例买的,比如10%- ...
- RN import ** from ** 用法
1.import React, { Component } from 'react': 导入‘react’文件里export的一个默认的组件,将其命名为React以及Component这个非默认组件 ...
- 给定一颗二叉搜索树,请找出其中的第k大的结点。例如, 5 / \ 3 7 /\ /\ 2 4 6 8 中,按结点数值大小顺序第三个结点的值为4。
/* struct TreeNode { int val; struct TreeNode *left; struct TreeNode *right; TreeNode(int x) : val(x ...
- Leetcode 388.文件的最长绝对路径
文件的最长绝对路径 假设我们以下述方式将我们的文件系统抽象成一个字符串: 字符串 "dir\n\tsubdir1\n\tsubdir2\n\t\tfile.ext" 表示: dir ...
- Ubuntu Flask安装与配置(待整理)
工作中开发需要用到python的flask框架,无奈网络上的资源很少,连基本的安装和配置都不全,在这做一下整理,方便以后用到. ———————————————————————————— 由于比较繁琐, ...
- 【Luogu】P2827蚯蚓(堆转队列)
按照国际惯例先发题目链接 woc从4月就开始做这sb题.最开始30分升到65分不管了,直到最近几天升到85分,再到今天AC.激动的心情自然是那些一遍就A或者一小时以内就A的神犇难以想象的. 下面说说 ...
- HackerRank# Red John is Back
原题地址 简单动归+素数判定,没用筛法也能过 代码: #include <cmath> #include <cstdio> #include <vector> #i ...