通过变量改变大盒子背景格式

//引入图片
import Img128 from '@/assets/img/newMyVoucher/UserInfo/128background.png';
import Img18 from '@/assets/img/newMyVoucher/UserInfo/18background.png';
import ImgGold from '@/assets/img/newMyVoucher/background.png';
import ImgNewStartBg from '@/assets/img/newMyVoucher/UserInfo/newStartBg.png';
//通过usestate控制变量
const [background, setBackground] = useState(``);
//创建函数进行判断
function getBannerBackground(options: any) {
    if (options.Pluslevel >= 128 || options.jiTuanVipLevel == 'plus') {
      setBackground(Img128);
      return;
    } else if (options.Pluslevel < 128 || options.jiTuanVipLevel == 'BoJin') {
      setBackground(Img18);
    } else if (options.isHaigou || options.jiTuanVipLevel == 'HuangJin') {
      setBackground(ImgGold);
    } else {
      setBackground(ImgNewStartBg);
    }
  }
//初始化的时候调用函数
useEffect(()=>{
getBannerBackground({ isHaigou, jiTuanVipLevel, Pluslevel });
})


retrun(
   <div
       className={styles.userInfoTop}
         style={{
            backgroundImage: 'url(' + background + ')',
            }}
    >
    </div>
)
posted @ 2022-03-17 16:28  xuelin  阅读(22)  评论(0编辑  收藏  举报