信息流（Feed）广告的对接及示例

1. 导入 FeedView 模块

import { FeedView, type FeedViewProps } from "@zmide/react-native-gromore";

导入 FeedViewProps 类型可用于后续个性化调整 FeedView 组件。

2. 根据需求设置 FeedViewProps （可选）

// `AutoFeedView` 仅为示例名称，可任意定义
const AutoFeedView = (props: FeedViewProps) => {
  ...
}

FeedViewProps 具有 ViewProps 全部属性的同时还定义了以下属性：

事件名称	描述	仅限iOS
onAdViewDidLoad	广告加载完成
onAdViewDidClick	广告被点击
onAdViewLoadFailWithError	广告加载、渲染失败
onAdViewDidBecomeVisible	广告视图展示
onAdViewDislikeWithReason	用户广告反馈
onAdViewDidRemoved	广告被移除
onAdViewRenderSuccess	广告渲染成功，仅模板广告会回调
onAdVideoStateDidChanged	视频播放状态变更	✅
onAdVideoDidPlayFinish	视频播放完成	✅

3. 使用 FeedView 组件

TIP

必须设置 feed_code 和 height ，否则组件加载渲染失败。

示例（参数功能可参考第二步）：

<FeedView
  slotId={codes.feed_code}
  style={{
    height: 300,
  }}
  onAdViewDidLoad={() => {
    console.log(`FeedView onAdViewDidLoad`);
  }}
  onAdViewRenderSuccess={() => {
    console.log('FeedView onAdViewRenderSuccess');
  }}
  onAdViewLoadFailWithError={({ nativeEvent }: any) => {
    console.log(
      'FeedView onAdViewLoadFailWithError',
      nativeEvent
    );
  }}
/>

若在第二步设置了 AutoFeedView 可将上述 <FeedView /> 组件替换为 <AutoFeedView />。