react-native使用第三方库以及引入react-native-elements(十二)

最新推荐文章于 2024-08-26 08:52:58 发布

Museions

最新推荐文章于 2024-08-26 08:52:58 发布

阅读量2.2k

点赞数

分类专栏： React Native开发文章标签： react-native JSX

本文解决了你的问题吗？转载注明链接,帮助更多人。

本文链接：https://blog.csdn.net/museions/article/details/99004272

版权

React Native开发专栏收录该内容

23 篇文章 3 订阅

订阅专栏

react-native使用第三方库以及引入react-native-elements
1.首先需要下载依赖包到本地


cd /project
yarn add react-native-elements
# or with npm
npm install react-native-elements

2.引入react-native-elements到项目的component中

User.js

以头像组件为例：

import { Avatar } from 'react-native-elements';

// Standard Avatar
<Avatar
  rounded
  source={{
    uri:
      'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg',
  }}
/>

// Avatar with Title
<Avatar rounded title="MD" />

// Avatar with Icon
<Avatar rounded icon={{ name: 'home' }} />

// Standard Avatar with edit button
<Avatar
  source={{
    uri:
      'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg',
  }}
  showEditButton
/>

做了一次搬运工，原始地址在这里：
https://react-native-elements.github.io/react-native-elements/docs/avatar.html

笔者用过这个做过一个完整的项目，相关的组件挺好用。提醒一下：不要过多依赖UI库，用react native + ES6实践，自己封装组件才能提高对框架的熟练度。