weex 在ios怎么调用.we文件

weex 在ios怎么调用.we文件,第1张

项目初始化1、没有现成的工程的话新建ios项目命令行cd到项目根目录 执行 pod init,会创皮销瞎建一个pod配置文件用编辑器打开,加上 pod 'WeexSDK', :path=>'./sdk/'

/weex在ios目录下有个sdk文件夹,把它复制到ios项目根目录,和podFile里配置的路径一致关掉xcode,在当前目录,命令行执行pod install,燃空现在项目目录变成了这样,以后点击xcworkspace文件打开项目创建一个新目录weex,命令行cd到weex目录,执行weex init,会提示你输入项目名称自动创建的文件:

在当前目录命令行执行npm install,安装依赖库创建一个文件夹js,命令行执行weex src -o js生成最终需要的js文件也可以weex src/main.we在浏览器预览或者weex src/main.we --qr 生成二维码,用playground App 扫描预览加载weex页面xcode打开workspace项目文件打开AppDelegate.m添加一下内容将之前创建的js文件夹拖到xcode工程的文件列表效果是这样的weex视图控制器的初始化ViewController.h:

[objc] view plain copy在CODE上查看代码片派生到我的代码片//// ViewController.h// weexDemo3//// Created by admin on 16/8/3.

// Copyright ? 2016年 admin. All rights reserved.

//#import <UIKit/UIKit.h>

@interface ViewController : UIViewController- (instancetype)initWithJs:(NSString *)[email protected]:

[objc] view plain copy在CODE上查看代码片派生到我的代码片//// ViewController.m// weexDemo3///斗仔/ Created by admin on 16/8/3.

// Copyright ? 2016年 admin. All rights reserved.

//#import "ViewController.h"#import <WeexSDK/WXSDKInstance.h>

@interface ViewController ()@property (nonatomic, strong) WXSDKInstance *instance@property (nonatomic, strong) UIView *weexView@end@implementation ViewController{NSURL *jsUrl}

- (instancetype)initWithJs:(NSString *)filePath{self = [super init]if (self) {//远程js文件//NSString *path=[NSString stringWithFormat:@"http://192.168.232.13:8080/examples/js/%@",filePath]//本地js文件NSString *path=[NSString stringWithFormat:@"file://%@/js/%@",[NSBundle mainBundle].bundlePath,filePath]NSLog(@"-----path:%@",path)jsUrl=[NSURL URLWithString:path]}

return self}

- (void)viewDidLoad {[super viewDidLoad]_instance = [[WXSDKInstance alloc] init]_instance.viewController = self_instance.frame=self.view.frame__weak typeof(self) weakSelf = self_instance.onCreate = ^(UIView *view) {[weakSelf.weexView removeFromSuperview]weakSelf.weexView = view[weakSelf.view addSubview:weakSelf.weexView]}_instance.onFailed = ^(NSError *error) {NSLog(@"加载错误")}_instance.renderFinish = ^ (UIView *view) {NSLog(@"加载完成")}if (!jsUrl) {return}

[_instance renderWithURL: jsUrl]self.view.backgroundColor=[UIColor whiteColor]}

- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning]// Dispose of any resources that can be recreated.

}

- (void)dealloc{[_instance destroyInstance]}

@end再打开AppDelegate成都软件开发公司http://www.yingtaow.com?chidcd创建导航控制器引入头文件#import "ViewController.h"创建导航视图:

[objc] view plain copy在CODE上查看代码片派生到我的代码片- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {//weex[self initWeex]ViewController *vc=[[ViewController alloc]initWithJs:@"main.js"]UINavigationController *nav=[[UINavigationController alloc]initWithRootViewController:vc]self.window.rootViewController=navreturn YES}

运行图片不显示是因为图片加载需要自己创建模块,可以直接把demo的代码和pod配置粘过来使用

1、DSL : weex文件;

2、Virtual DOM (提升性能) :

简单的说就是:

3、Android RenderEngine 将输入Virtual DOM 转换成输出的android原声控件;

1.Weex和H5对比

2.Weex和RN对比

3.Weex优势

4.Weex劣势

1.使用本地图片

<image class = "setBtn" src= 'xcassets:my_setting'/>

2.list中cell的margin无效

将cell的最外层嵌套一哪蚂虚个div,对div进行margin *** 作

3.Weex和Native的交互

将WXCustomEventModule注册为callNative

实现并注册方法pushNativeVC::

4.元素的显示隐藏

因为weex没有兼容v-show和display:none的属性,所以要实现元素的显示隐藏要使用v-if,其值为bool值

5.类选择器

和vue语法不同,其格式为:class="[loginState?'TopLoginItem':'TopItem']"

6.视图的李燃生命周期 willAppear,willDisAppear

如果考虑三端,可以尝试Weex开发

如果已经有大量实践Vue,也可以尝试Weex开发

对渲染UI的流畅度物戚有较高的期望又想能支持热更新,也可以尝试Weex开发

这是一个提供了常见的列表功能的核心组件,通过平滑滚动和内存回收提供了更好的用户体验和性能

注意: list的子组件只能包括 cell, header, refresh, loading 或者是 fix定位的组件. 其他形式的组件将不能被正确的渲染

loadmoreoffset: <number>触发loadmore事件所需要的滚动条距离list底部的垂直偏移距离.当list的滚动条滚动到足够接近list底部时将会触发load more这个事件

公共样式

loadmore: 如碧核果列表滚动到底部将会立即触悔乎掘发这个事件,你可以在这个事件的处理函数中加载下一页的列表项.

公共事件

支持click 事件

支持 appear / disappear 事件

scrollToElement(node, options)

让页面顷肢滚动到那个对应的节点,这个API只能在scroller和list组件中用。

要在你的.we文件中使用这个API,可以使用require('@weex-module/dom').scrollToElement。

不允许相同方向的list或者scroller互相嵌套.换句话说就是嵌套的lists/scroller必须是不同的方向

举个例子,不允许一个垂直方向的list嵌套的一个垂直方向的scroller中,但是一个垂直方向的list是可以嵌套的一个水平方向的list或者scroller中的.


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/12283396.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-24
下一篇 2023-05-24

发表评论

登录后才能评论

评论列表(0条)

保存