React Native 뷰 구성요소-JS 튜토리얼-php.cn

React Native 뷰 구성요소

php中世界最好的语言

풀어 주다： 2018-03-17 13:11:22

원래의

1137명이 탐색했습니다.

이번에는 React Native 뷰 컴포넌트를 가져왔습니다. React Native 뷰 컴포넌트의 주의사항은 무엇인가요?

이 글에서는 주로 React Native에서 이미지 컴포넌트를 보는 방법을 소개합니다. 편집자께서 꽤 괜찮다고 생각하셔서 지금 공유하고 참고용으로 올려드리겠습니다. 에디터를 따라가서 살펴볼까요

React 네이티브 이미지 보기 컴포넌트: React-native-image-viewer, 순수 JS 컴포넌트, 작고 빠른 아이콘 보기 컴포넌트. 이미지 확대 및 축소, 이미지 로드 실패 시 대체 이미지 설정, 이미지 로컬 저장 등을 지원합니다.

Rendering

InstallationMethod

npm i react-native-image-zoom-viewer --save

로그인 후 복사

사용 예

const images = [
 {
  url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
 },
 {
  url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
 },
 {
  url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460',
 },
];
export default class Component06 extends Component {
 constructor(props) {
  super(props);
 }
 render() {
  return (
   <View style={{ flex: 1 }}>
    <ImageViewer
     imageUrls={images}
     failImageSource={{
      url: &#39;https://avatars2.githubusercontent.com/u/7970947?v=3&s=460&#39;,
      width: Dimensions.get(&#39;window&#39;).width,
      height: Dimensions.get(&#39;window&#39;).width,
     }}
    />
   </View>
  );
 }
}

로그인 후 복사

주요 매개변수 설명