react图片自适应组件

react

import * as React from 'react';

import 'animate.css/animate.css'

import {AutoImg} from "./style";

import {observer} from "mobx-react";

import {action} from "mobx";

import {IAd} from "../../util/type";

interface IIndexProps {

url: string;

row:boolean;

width:number;

height:number;

}

@observer

class Index extends React.Component<IIndexProps> {

constructor(props) {

super(props);

}

public render() {

const {url,row,width,height} = this.props;

return (

<div style={{width:`${width}px`,height:`${height}px`,overflow: 'hidden',display:'flex',alignItems:'center',justifyContent:'center'}}>

{

row

?

<img src={url} style={{width:'auto',height:'100%'}} alt=""/>

:

<img src={url} style={{width:'100%',height:'auto'}} alt=""/>

}

</div>

);

}

}

export default Index;

  

以上是 react图片自适应组件 的全部内容, 来源链接: utcz.com/z/382720.html

回到顶部