react-native imageButton 可设置默认图片，避免加载失败空白

来源：互联网发布：冷核聚变知乎编辑：程序博客网时间：2024/05/17 21:45

import React, {Component} from 'react';import {TouchableOpacity, Image} from 'react-native';export default class ImageButton extends Component {    render() {        return (            <TouchableOpacity activeOpacity={0.9} onPress={this.props.onPress}>                {this._renderImg()}            </TouchableOpacity>        )    }    _renderImg(){        if(this.props.defaultSource){            return (                <Image                    style={this.props.style}                    source={this.props.defaultSource}                >                    <Image                        style={this.props.style}                        source={this.props.source}                    >                        {this.props.children}                    </Image>                </Image>            )        }else {            return (                    <Image                        style={this.props.style}                        source={this.props.source}                    >                        {this.props.children}                    </Image>            )        }    }}

使用

        <ImageButton                    defaultSource={require("../img/avatar.png")}                    source={{uri: item.img}}                    style={styles.imgStyle}                    onPress={()=>this._clickItem(item)}                >

阅读全文

0 0