I'm trying to use a SwiftUI component with my React Native app, which appears to be a little complicated since I haven't found any documentation or tutorials for doing this online. Here are the files I'm using:
CategoryCardView.swift
import UIKit
import SwiftUI
struct CategoryCard: View {
var name: String
var body: some View {
Text(name)
}
}
@objc(RCTCategoryCardViewManager)
class RCTCategoryCardViewManager: RCTViewManager {
override static func requiresMainQueueSetup() -> Bool {
return true
}
@objc var name: String = "Default text"
override func view() -> UIView! {
let swiftUIView = CategoryCard(name: name)
let viewController = UIHostingController(rootView: swiftUIView)
return viewController.view
}
}
CategoryCardView.m
#import <React/RCTViewManager.h>
@interface RCT_EXTERN_MODULE(RCTCategoryCardViewManager, RCTViewManager)
RCT_EXPORT_VIEW_PROPERTY(name, NSString)
@end
NativeCategoryCard.tsx (in React Native):
import {requireNativeComponent} from "react-native";
import React from "react";
const NativeCategoryCard = requireNativeComponent('RCTCategoryCardView');
export interface CategoryCardProps{
name: string;
}
function CategoryCard(props: CategoryCardProps) {
return <NativeCategoryCard
style={[{
height: 100,
width: 100
}]}
{...props}
/>
}
export default CategoryCard;
And then somewhere in my React Native code:
<CategoryCard text='hello' />
My app throws the following error when it tries rendering <CategoryCard>
:
Exception thrown while executing UI block: -[_TtGC7SwiftUI14_UIHostingViewV7PalChat12CategoryCard_ setName:]: unrecognized selector sent to instance 0x7fc8718c7830
I don't really understand Swift and SwiftUI thoroughly, especially in terms of integrating it with React Native, so I apologise if I'm making an obvious mistake.