在React Native中创建“Div”和“Span”组件

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在React Native中创建“Div”和“Span”组件相关的知识,希望对你有一定的参考价值。

我在各种论坛中都看到过在React Native中使用“View”是在React中使用'div'的准等价。

虽然我理解View组件的原因(谁想支持所有'div'选项?),但似乎可以处理一个可以处理大部分合理'div'和'span'属性的组件,以便移植React React本土并不是那种乏味的苦差事。

有没有人有这样的组件,他们已经测试过,可以分享?关于样式支持,映射事件和映射子项的所有问题似乎都是重复的,因为几乎每个人都会跳进React Native。

就像是

class Div extends Component {  //or Class Span extends Component

  static propTypes = {
    style : PropTypes.obj
    onClick : PropTypes.func   // ...
  }

  render (){
    return (
      <View>
      {
        /* whatever is needed to pass everything through  ... */
      }
      </View>
  }
}
答案

我想你错过了React Native的观点。它旨在具有映射到移动平台的本机UI组件的组件。它并不意味着需要html并以某种方式将其转换为看起来像移动应用程序的东西。这就是它被称为“Native”的原因 - 因为它实际上使用了平台上的UI。如果您想使用常见的HTML元素制作移动应用程序,那么为什么不坚持使用Cordova / Ionic等框架?

React现在就像一个成语,它允许您构建用户界面,无论设备如何。 React Native只接受React“idiom”并知道如何在移动屏幕上呈现它。所以没有“将React移植到React Native”这样的东西。

如果您想进行实验,是的,您可以制作自定义Div组件和自定义Span组件 - 这取决于您。您可以将道具从该组件向下传递到视图或文本。但我认为这将是多余的。通常你会创建自己的组件,在幕后将使用View和Text和TextInput等 - React Native的所有基本组件。

另一答案

虽然我100%同意@nbkhope的回答,但我发现@LostInSpace正在寻找的答案是替代HTML <div>

这似乎是这样的事情:https://www.npmjs.com/package/react-native-div

以上是关于在React Native中创建“Div”和“Span”组件的主要内容,如果未能解决你的问题,请参考以下文章

如何在 React-Native 中创建检测自动位置的地图

如何在 React Native 中创建文本边框?

如何通过@react-native-community/slider 在android中创建垂直滑块?

如何在 react-native (iOS) 中创建离散滑块?

如何在 React Native 中创建拖放操作?

如何在 React Native 中创建自定义日历?