React Native中显示fragment的问题

最新推荐文章于 2025-07-11 14:14:00 发布

原创最新推荐文章于 2025-07-11 14:14:00 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#native

react-native 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种在ReactNative应用中集成原生K线图Fragment的方法。作者尝试直接将Fragment放入FrameLayout中但未能成功显示，最终决定采用替代方案实现目标功能。

部署运行你感兴趣的模型镜像

上司让我react native 中显示原生已经写好的 K线图，原生那边给我的是 fragment界面，一开始我将fragment放到framelayout 中返回，framelayout 显示了，但是fragment就是怎么样都不显示，后面就去google，发现有一些人也有这些问题，但是没有人有好的答案，最后也只能换个方法来实现了。

所以，如果你也遇到这个问题，还是换个思路写吧，别浪费时间了。

您可能感兴趣的与本文相关的镜像

ComfyUI

AI应用

ComfyUI

ComfyUI是一款易于上手的工作流设计工具，具有以下特点：基于工作流节点设计，可视化工作流搭建，快速切换工作流，对显存占用小，速度快，支持多种插件，如ADetailer、Controlnet和AnimateDIFF等

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

wodata1

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

工作中最实用的React-Native性能优化总结

qq_29896351的博客

01-03

2498

，如果不使用 getItemLayout，那么所有的 Cell 的高度，都要调用 View 的 onLayout 动态计算高度，这个运算是需要消耗时间的；React Native 因为它的特殊性，做一些性能分析和调试时，需要用到 RN/iOS/Android 三端的工具，下面我就列举一下我平常用到的工具，具体的使用方法不是本文的重点，如有需要可根据关键词自行搜索。在实际开发中，经过一些数据对比，因绑定事件方式的不同引起的性能消耗基本上是可以忽略不计的，re-render 次数过多才是性能杀手。

React Native组件库推荐：20个必备UI组件提升开发效率

移动开发前沿的博客

05-23

2471

本文聚焦React Native开发者的**“开发效率痛点”**：重复造轮子（如按钮、输入框）、多端样式不一致、复杂交互实现困难。通过推荐20个经过社区验证的优质组件库，覆盖从基础到高级的全场景需求，帮助开发者跳过“造组件”阶段，直接进入“用组件”的高效开发模式。本文先通过“建房子”比喻解释组件库的价值，再按功能场景分类推荐20个组件库（附核心功能+代码示例），最后通过实战案例演示如何集成使用，解答“选哪个”“怎么用”“何时用”的关键问题。想象你要建一栋房子：如果每次都要自己烧砖、砍木头、做门窗，工期会很长

1 条评论您还未登录，请先登录后发表或查看评论

react-native-android-fragment：已弃用：一个实用程序库，用于通过Android Fragments促进React Native开发

02-26

已淘汰该库已被弃用，Hudl不再使用。如果您一直在使用此库，请考虑在主要的本机repo中采用。 react-native-android-fragment 一个实用程序库，用于使用Android Fragments促进React Native开发。入门 $ npm install react-native-android-fragment --save 或者 $ yarn add react-native-android-fragment 大多是自动安装 $ react-native link react-native-android-fragment 手动安装安卓将以下行添加到android/settings.gradle ： include ':react-native-android-fragment' project(':react-native-android

在 Fragment 中使用 React Native

梦家之家

03-14

2899

1.Applications 实现 ReactApplication 的抽象方法 getReactNativeHost，加载jsx资源。 package com.silabs.reactnativeappdemos; import android.app.Application; import com.facebook.react.ReactApplication; import

react-native-android-fragment:使用XML将本机Android片段公开给React-Native

05-16

react-native-android-fragment 用本地回收者视图增强列表！尝试使用以下示例： $ yarn / npm install $ react-native link

React-Native React.Fragment 去除无用的节点

飞翔的熊blabla

07-22

391

render() { return ( <View> <Text>黑猫警长</Text> <Text>哪吒传奇</Text> <Text>四驱兄弟</Text> ...

React Native的fragment和JetPack ViewPager2的集成

曲折旅程，艰难人生

05-30

921

RN和Android原生应用集成的一种重要方式

如何在原有Android项目中快速集成React Native详解

01-05

在得到一些信息后，可以看出，要用RN高效率的做出比较不错的App是有可能的，单看投入度与最初设计是否合理，而且现在关于React Native的各种文档是相当丰富的，所以这个阶段想切入RN可能是一个不错的选择。...

ReactNative inside Android Fragment

u011562187的专栏

04-02

732

今天帮同事解决了一个在Fragment里面使用RN页面的需求，记录一下. ReactFragment package com.xxx; import android.content.Intent; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.annotati...

Android原生项目Fragment中集成React Native

SemiraChen的博客

08-22

2412

Android原生项目Fragment中集成React Native Android中集成ReactNative网上的方法众说纷纭，我试了好多也都可以实现，我挺迷茫的。最后我整理出了自己喜欢的一种方式。有好多方法是在Application中实现ReactApplication，然后重写getReactNativeHost方法返回在Application中实例化的一个ReactNativeHos...

react-kline:基于react的k线图组件

05-10

react-kline 基于React的K线图组件演示地址安装和使用安装 $ npm install react-kline 使用 import React from 'react'; import ReactDOM from 'react-dom'; import ReactKline from 'react-kline'; class App extends React.Component { onRequestData(param,callback){ let data={}; //请求数据 //... callback(data); } render() { return

android fragment inside react-native

逐渐深入

05-18

266

React Native official documentation provides way to integrate RN into your android application via Activity and Fragment.In this post we will learn, from start to end (including steps as given in official docs), on how to display your react native app into

fragment中文网_更新 · React Native 中文网

weixin_28871097的博客

01-14

215

时刻将 React Native 更新到最新的版本，可以获得更多 API、视图、开发者工具以及其他一些好东西(译注：官方开发任务繁重，人手紧缺，几乎不会对旧版本提供维护支持，所以即便更新可能带来一些兼容上的变更，但建议开发者还是尽一切可能第一时间更新)。由于一个完整的 React Native 项目是由 Android 项目、iOS 项目和 JavaScript 项目组成的，且都打包在一个 npm...

React的fragment使用

weixin_46448487的博客

01-13

331

在开发中，我们总是在一个组件中返回内容时包裹一个div元素：希望可以不渲染这样一个div应该如何操作呢？使用fragment,它允许将子列表分组，而无需向 DOM 添加额外节点; 短语法: <> </>；注意: 如果我们需要在Fragment中添加key，那么就不能使用短语法! ...

【React Native】原生组件

最新发布

小秀的博客

07-11

319

在 rn 中，View，Text，并不是HTML里的标签。它们都是原生组件，而且正因为是原生组件，所以在安卓和 IOS 的显示不尽相同。StatusBar，它是用来控制显示屏幕顶部的电量、网络信息的。View，可以当成HTML里的div来用，也就是用来布局页面用的。可以用它来包住其他的一些组件。但是View不提供滚动，如果内容超出屏幕范围，就没法显示出来了。我们现在做一些尝试。在View的下面，再增加一个View。return里，只返回了一个元素。如果返回了<></>

react：React.Fragment的使用

分享前端开发工程师的一些日常生活、前端知识点、职业发展、对一些问题的看法、感悟等等

03-21

590

官方文档介绍相当于一个空标签，同 vue 的 template 相似使用 class Columns extends React.Component { render() { return ( <React.Fragment> <td>Hello</td> <td>World</td> </React.Fragment> ); } } 同 class

react-native组件生命周期

weixin_44373115的博客

09-07

435

对react-native生命周期进行总结生命周期调用次数能否使用setState() getDefaultProps 1（全局调用一次）否 getInitialState 1 否 componentWillMount 1 是 render >=1 否 componentDidMount 1 是 componentWillReceiveProps >=0 是 shou..

react-native集成超级强大的图表工具native-echarts

大灰狼的小绵羊哥哥的博客

05-03

4502

闲话不多说，先到上动态图让大家看看。使用起来超级简单，完美适配iOS和Android chart.gif 简单介绍一下：1.苹果橘子这个可以根据legend这个属性来设置，可一个可多个。具体参考代码2.可以是单独的一种图形，也可以是多种切换3.图形的颜色可以根据color属性来改，具体请参考代码下面介绍下使用方法： 1。 npm install native-

React Native笔记(一)：封装android原生列表组件给rn使用

ZBM来了

03-21

3815

背景 react native官方提供的FlatList与原生RecyclerView相比：仅创建可见区域的视图，两者是一致的。 FlatList没有cell recycling，重用item view。 FlatList中将不可见的视图从内存中移除，但同时也会导致大量的视图重新创建以及垃圾回收。如果不断的创建视图，在列表滚动的过程中，内存占用量会不断增加。而原生的recyclerview因为能复用视图，所以在快速滑动的时候性能上影响不大。并且rn又支持封装原生组件给rn使用，于是产生了封装recyc