有错误希望大家指正哈，我只是个小白、渣渣。

 一.react 图片引用的方法

 1.使用import 方式在头部引用本地图片

   import img from '../assets/img.png

2.使用require 方式在img标签内直接引用

 <img src={require('../assets/img/5e32d2530847528006000338-360-202.jpg')}  />

二.react 样式问题

1.css设置背景图问题，react 在标签内设置样式时，属性都是驼峰式写法，例如：background-color:要写成backgroundColor

在设置backgroundImage时，url引用图片不当有时会报错，正确写法

在标签内引入图片方式

1.在render方法里声明一个对象

const bgStyle={

      backgroundImage:`url(${this.state.Bk})`

}

使用：

<div className="bk" style={bgStyle}></div>

- 2.使用require，好像不能动态获取图片

<div className="bk" style={{backgroundImage:"url("+require('../assets/img/5e683f6f00012ec118720764.jpg')+")"}}></div>

- 3.动态获取图片直接简单

<div className="bk" style={{ backgroundImage:`url(${this.state.Bk})`}}></div>

三.条件渲染问题

- 1.&& 进行条件判断

{this.state.cartCount > 0 && <span>{this.state.cartCount}</span> }

- 2.三元表达式 进行条件判断

{this.state.BannerTextData.map((BannerDataItem,index)=>

           this.state.BannerTextIndex == index ? <BannerC BannerDataItem={BannerDataItem}></BannerC>:''

   )}

- 3.if 条件判断

首先在render函数里声明一个函数IsCartCount

function IsCartCount(BannerTextIndex){

            if(Number(BannerTextIndex.TextIndex) === BannerTextIndex.index){

                return <BannerC BannerDataItem={BannerTextIndex.BannerDataItem}></BannerC>

            }else{

                return ''"

            }

        }

BannerC这个组件是写在循环之中，判断如果索引相同则显示对应的内容，使用方法

<IsCartCount TextIndex={this.state.BannerTextIndex} BannerDataItem={BannerDataItem} index={index}></IsCartCount>

注：IscartCount组件属性传入IscartCount函数时，会以json对象的方式 返回传入的参数

console.log(BannerTextIndex),打印其值如下

{

     TextIndex:0

      BannerDataItem:{...}

      index:0

}