Блог

 import React, { Component } from 'react';

class Product extends Component {
    state = { 
        name: "Burger",
        count: 3,
        imgUrl: "logo192.png"
     }

    render() { 
        return ( 
            <div>
                <img src={this.state.imgUrl} alt="" />
                <span style={{ color: "red" }}>{this.state.name}</span>
                <span className="badge badge-warning m-2">{this.state.count}</span>
            </div>
         );
    }
}
 
export default Product;
 

Я пытаюсь показать значение счетчика в состоянии в методе render() с помощью {this.state.count}, но оно не отображается в браузере.

Когда я запускаю ваш фрагмент кода, я вижу, что отображается ваш счетчик. Мое предложение состояло бы в том, чтобы проверить промежуток внутри ваших элементов в инструменте инспектора chrome. Если промежуток есть и внутри него есть значение 3, то это будет проблемой со стилем className="badge badge-warning m-2"