如何在React中选择导入/导出

时间:2018-02-16 11:28:50

标签: javascript reactjs webp

我想在用户在Chrome中打开网页时使用WebP 而且它应该是png。

我找到了这个代码:

var isChrome = !!window.chrome && !!window.chrome.webstore

但是我不能在导出或导入时添加一个If语句

到目前为止,这是我的代码:

import redditwebp from '../img/icons/reddit.webp';
import redditpng from '../img/icons/reddit.png';

var isChrome = !!window.chrome && !!window.chrome.webstore;

if(isChrome){
  export default {redditwebp}
}
else{
  export default {redditpng}
}

1 个答案:

答案 0 :(得分:1)

如果你应该做一个内联的陈述,那你就不应该做得很正常

const isChrome = !!window.chrome && !!window.chrome.webstore;

然后在你的实际代码内联

<div>{isChome ? <img src={redditwebp} alt="" /> : <img src={redditpng} alt="" />}</div>

对我来说这是最好的方法,你可能要写this.isChrome我不确定你是否愿意。

我会更清楚。

import redditwebp from '../img/icons/reddit.webp';
import redditpng from '../img/icons/reddit.png';
import React, { Component } from 'react';

const isChrome = !!window.chrome && !!window.chrome.webstore;

export default class logo extends Component {
render(){
    return (
        <div>{isChome ? <img src={redditwebp} alt="" /> : <img src={redditpng} alt="" />}</div>
    }
}