React Native 如何从js world传递swift自定义组件属性

osh3o9ms  于 2023-08-07  发布在  React
关注(0)|答案(3)|浏览(103)

我有一个Swift写的自定义组件,我想从js world传递一些自定义属性,
但我真的不知道怎么做,下面提供一些主要代码。

Demo-Bridging-Header.h

#import "RCTBridgeModule.h"
#import "RCTViewManager.h"

字符串

CollectionViewManagerBridge.m

#import "RCTView.h"
#import "RCTViewManager.h"

@interface RCT_EXTERN_MODULE(CollectionViewManagerSwift, RCTViewManager)

@end

CollectionViewManagerSwift.swift

@objc(CollectionViewManagerSwift)

class CollectionViewManagerSwift : RCTViewManager, UICollectionViewDataSource, UICollectionViewDelegate {
  
  let contentCellIdentifier = "CellIdentifier"
  var collectionView: UICollectionView
  
  override init() {
    let layout = CustomCollectionViewLayout()
    let collectionView = UICollectionView(frame: CGRectZero, collectionViewLayout: layout)
    
    collectionView.registerClass(CustomCell.self, forCellWithReuseIdentifier: contentCellIdentifier)
    collectionView.directionalLockEnabled = false
    collectionView.backgroundColor = UIColor.whiteColor()
    
    self.collectionView = collectionView
  }
  
  override func view() -> UICollectionView! {
    self.collectionView.delegate = self
    self.collectionView.dataSource = self
    
    return self.collectionView;
  }

  // ... some other code

}


另外,我还有上面用到的CustomCell.swiftCustomCollectionViewLayout.swift
当我从js world调用render()方法中的<CollectionViewManagerSwift />时,这些代码工作正常,
但是我如何从js world传递属性,比如<CollectionViewManagerSwift customProperty={customProperties} />,以及如何在我的swift代码中定义customProperty
也许我没有表达清楚,谢谢你的时间。

后续

我尝试在CollectionViewManagerBridge.m中添加customProperty

#import "RCTView.h"
#import "RCTViewManager.h"

@interface RCT_EXTERN_MODULE(CollectionViewManagerSwift, RCTViewManager)

RCT_CUSTOM_VIEW_PROPERTY(customProperty, NSArray, CollectionViewManagerSwift)
{
  NSLog(@"%@ -- %@", json[0], json[1]);
}

@end


然后从js world调用

<CollectionViewManagerSwift customProperty={['foo', 'bar']} />


我在Xcode输出中得到值

2016-02-27 17:58:07.167 Demo[49690:12639774] foo -- bar


但是怎么才能在CollectionViewManagerSwift.swift中获取customProperty呢?
再次感谢。
问候

7uzetpgm

7uzetpgm1#

不知道是否有其他方法(一个更好的方法)来实现它。
无论如何,我有一个用swift编写的UI库,我想为RN创建一个模块(node + pod),以便我可以在其他RN项目中使用它。

@objc(SampleSwiftViewManager)
public class SampleSwiftViewManager:RCTViewManager {
    
    @objc(setSrc:)// --> this is important
    public func setSrc(obj:Dictionary<String, Any>) {
        guard let currentView = obj["view"] as? SampleSwiftView,
              let src = obj["json"] as? String else {
            return
        }
        
        currentView.setSrc(src: src)
    }
    
    
    public override func view() -> UIView! {
        return SampleSwiftView()
    }
}

class SampleSwiftView: UIView {
    
    // custom view implementation ....
    
    // example prop method
    func setSrc(src:String) {
        // ....
    }
}

字符串
在Objective-C中

#import <Foundation/Foundation.h>
#import <React/RCTViewManager.h>
#import <React/RCTUIManager.h>

@interface RCT_EXTERN_MODULE(SampleSwiftViewManager, RCTViewManager)

RCT_CUSTOM_VIEW_PROPERTY(src, NSString, NSObject) {
    [self performSelector:@selector(setSrc:) withObject:@{@"view":view, @"json":json}];
}

@end

toe95027

toe950272#

您需要:“实现-(UIView *)视图方法”,如本文档所述:http://facebook.github.io/react-native/docs/native-components-ios.html#content
这就是您能够初始化CollectionView的地方。

mwg9r5ms

mwg9r5ms3#

在@Suryavel的回答中添加更多细节。
如果你想传递多个参数,你也可以像下面这样做

// .m
RCT_CUSTOM_VIEW_PROPERTY(padding, NSDictionary, NSObject) {
    [self performSelector:@selector(setPadding:withObj:) withObject:view withObject:json];
}

个字符

相关问题